前端加密解密之Crypto.js

前端js加密概述

對系統安全性要求比較高，那麼須要選擇https協議來傳輸數據。固然不少狀況下通常的web網站，若是安全要求不是很高的話，用http協議就能夠了。在這種狀況下，密碼的明文傳輸顯然是不合適的，由於若是請求在傳輸過程當中被截了，就能夠直接拿明文密碼登陸網站了。

HTTPS（443）在HTTP（80）的基礎上加入了，SSL（Secure Sockets Layer 安全套接層）協議，SSL依靠證書來驗證服務器的身份，併爲瀏覽器和服務器之間的通訊加密。傳輸前用公鑰加密，服務器端用私鑰解密。

對於使用http協議的web前端的加密，只能防君子不能防小人。前端是徹底暴露的，包括你的加密算法。知道了加密算法，密碼都是能夠破解的，只是時間問題。而爲了保證數據庫中存儲的密碼更安全，則須要在後端用多種單向（非對稱）加密手段混合進行加密存儲。

前端加密後端又須要解密，因此須要對稱加密算法，即前端使用 encrypted = encrypt(password+key)，後端使用 password = decrypt(encrypted +key) ，前端只傳輸密碼與key加密後的字符串encrypted ，這樣即便請求被攔截了，也知道了加密算法，可是因爲缺乏key因此很難破解出明文密碼。因此這個key很關鍵。而這個key是由後端控制生成與銷燬的，用完即失效，因此即便能夠模擬用加密後的密碼來發請求模擬登陸，可是key已經失效了，後端仍是驗證不過的。

注意，若是本地環境本就是不安全的，key被知道了，那就瞬間就能夠用解密算法破解出密碼了。這裏只是假設傳輸的過程當中被截獲的情形。因此前端加密是防不了小人的。若是真要防，能夠將加密算法的js文件進行壓縮加密，不斷更新的手段來使js文件難以獲取，讓黑客難以獲取加密算法。變態的google就是這麼幹的，本身實現一個js虛擬機，經過不斷更新加密混淆js文件讓加密算法難以獲取。這樣黑客不知道加密算法就沒法破解了。

經常使用的對稱加密算法有 DES、3DES（TripleDES）、AES、RC二、RC四、RC5和Blowfis。能夠參考：經常使用加密算法的Java實現總結

前端加密解密

//這裏是require的一個組件 Tripledes是Crpto.js庫
define(['jquery','Tripledes'], function ($,Tripledes){
    var groupCrypto = {};
    var fn={
        key:'huakangdashen'//Ĭ祕鑰
    }
    CryptoJS.mode.ECB = (function () {
        var ECB = CryptoJS.lib.BlockCipherMode.extend();
        ECB.Encryptor = ECB.extend({
            processBlock: function (words, offset) {
                this._cipher.encryptBlock(words, offset);
            }
        });
        ECB.Decryptor = ECB.extend({
            processBlock: function (words, offset) {
                this._cipher.decryptBlock(words, offset);
            }
        });
        return ECB;
    }());
    /**加密方法**/
    groupCrypto.encryptByDES=function(message, key) {
        /**判斷傳參類型**/
        if(message===""||message===null||message===undefined){
            return "";
        }
        if(typeof(message)!="string"){
            message=message.toString();
        }
        var keyHex = CryptoJS.enc.Utf8.parse(key||fn.key);
        var encrypted = CryptoJS.DES.encrypt(message, keyHex, {
            mode: CryptoJS.mode.ECB,
            padding: CryptoJS.pad.Pkcs7
        });
        return encrypted.toString();
    }
    /**解密方法**/
    groupCrypto.decryptByDES=function(ciphertext, key) {
        if(ciphertext===""||ciphertext===null||ciphertext===undefined){
            return "";
        }
        if(typeof(ciphertext)!="string"){
            ciphertext=ciphertext.toString();
        }
        var keyHex = CryptoJS.enc.Utf8.parse(key||fn.key);
        var decrypted = CryptoJS.DES.decrypt({
            ciphertext: CryptoJS.enc.Base64.parse(ciphertext)
        }, keyHex, {
            mode: CryptoJS.mode.ECB,
            padding: CryptoJS.pad.Pkcs7
        });
        return decrypted.toString(CryptoJS.enc.Utf8);
    }
    return groupCrypto;
});

複製代碼

這裏是require的一個組件 Tripledes是Crpto.js庫 這裏用的是DES加密 本代碼只是示例 祕鑰位置須要本身根據項目實例進行規劃放什麼地方。也能夠請求接口由後端生成 每次生成不一樣的key。

以後入參的時候進行加密入參 後端返回的重要參數能夠是加密後的 前端進行解密處理