JS加密插件CryptoJS實(shí)現(xiàn)AES加密操作示例

更新時(shí)間：2018年08月16日 11:07:28 作者：bEArInSPing

這篇文章主要介紹了JS加密插件CryptoJS實(shí)現(xiàn)AES加密操作,結(jié)合實(shí)例形式分析了CryptoJS插件的具體設(shè)置與AES加密操作實(shí)現(xiàn)技巧,需要的朋友可以參考下

本文實(shí)例講述了JS加密插件CryptoJS實(shí)現(xiàn)AES加密操作。分享給大家供大家參考，具體如下：

最近在做一個(gè)項(xiàng)目，考慮到數(shù)據(jù)的安全性，我們要給數(shù)據(jù)在傳輸過程中加密，防止一些惡意的操作以及爬蟲抓取數(shù)據(jù)。

用到的庫(kù)：CryptoJS 官方地址：https://code.google.com/archive/p/crypto-js/

首先看看這個(gè)CryptoJS的目錄結(jié)構(gòu)

主要是兩個(gè)文件夾，components和rollups

第一個(gè)是組件，第二個(gè)是匯總。

在匯總文件夾中的文件是在組件一個(gè)或多個(gè)文件夾拼接后壓縮的。

這使得匯總獨(dú)立的文件夾在你的項(xiàng)目納入項(xiàng)目文件，而無(wú)需擔(dān)心它的依賴。

你可以在這里查看匯總文件和組件之間的關(guān)系：

https://code.google.com/p/crypto-js/source/browse/tags/3.1.2/builder/build.yml

首先在項(xiàng)目中引入對(duì)應(yīng)的加密文件，我們用的是AES,同時(shí)用RequireJS來加載JS，在配置中聲明路徑：

require.config({
  baseUrl: "/Public/Home/Js/lib",
  paths: {
    hzbAES:'../module/hzb.AES'
  }
});

首先把加密解密封裝好為一個(gè)模塊

//模塊初始化
var init=function () {
    key = CryptoJS.enc.Utf8.parse(CryptoJS.MD5(ym.hezubao).toString());
    iv = CryptoJS.enc.Utf8.parse(CryptoJS.MD5(key).toString().substr(0,16));
}
function encrypt(data) {
    var encrypted='';
    if(typeof(data)=='string')
    {
      encrypted = CryptoJS.AES.encrypt(data,key,{
        iv : iv,
        mode : CryptoJS.mode.CBC,
        padding : CryptoJS.pad.ZeroPadding
      });
    }else if(typeof(data)=='object'){
      data = JSON.stringify(data);
      encrypted = CryptoJS.AES.encrypt(data,key,{
        iv : iv,
        mode : CryptoJS.mode.CBC,
        padding : CryptoJS.pad.ZeroPadding
      })
    }
    return encrypted.toString();
}
/*AES解密
* param : message 密文
* return : decrypted string 明文
*/
function decrypt(message) {
    decrypted='';
    decrypted=CryptoJS.AES.decrypt(message,key,{
      iv : iv,
      mode : CryptoJS.mode.CBC,
      padding : CryptoJS.pad.ZeroPadding
    });
    return decrypted.toString(CryptoJS.enc.Utf8);
}

解釋一下代碼：

我們加密的模式選的是CBC的，然后填充模式是填充0，這個(gè)是前后臺(tái)約定的，請(qǐng)謹(jǐn)慎。加密秘鑰要求是32位長(zhǎng)字符串（通過md5加密確保32位，算法限制），iv初始化向量是16位長(zhǎng)度的字符串。這兩個(gè)東西不懂的話，看看AES加密的條件。
要注意的是，在加密完成后的字符串是經(jīng)過Base64加密的，也就是說，后臺(tái)解密模塊必須要求考慮字符編碼問題，這個(gè)由項(xiàng)目實(shí)際來決定。可以把他先轉(zhuǎn)出UTF8的然后再傳遞給后臺(tái)。我這里后臺(tái)是介紹Base64加密后的，所以就不用轉(zhuǎn)碼了。
解密之后要轉(zhuǎn)成UTF8喔，如果后臺(tái)給的數(shù)據(jù)是JSON的話，要用JSON.parse()一下才能用。

在代碼中調(diào)用

require(['hzbAES'], function(hzbAES){
  var jsonData={'id':2,'username':'春天的熊'};//json格式數(shù)據(jù)（加密支持json格式和字符串格式）
  $('#btn_test').click(function () {
    var encrypt=hzbAES.encrypt(jsonData);
      console.log('前臺(tái)發(fā)過去的數(shù)據(jù)：'+encrypt);//已加密
    $.getJSON(UrlGenerator.url(2,'Home','Index','test'),{'data':encrypt},function (data) {
      if(!data['error'])
      {
        var decrypt=JSON.parse(hzbAES.decrypt(data['data']));
        console.log('后臺(tái)發(fā)過來的數(shù)據(jù)：');//已解密
        console.log(decrypt);
      }else{
        console.log(data['error']);
      }
    })
  });
});

PS：關(guān)于加密解密感興趣的朋友還可以參考本站在線工具：

在線AES加密/解密工具：
http://tools.jb51.net/password/aes_encode

文字在線加密解密工具（包含AES、DES、RC4等）：
http://tools.jb51.net/password/txt_encode

在線編碼轉(zhuǎn)換工具(utf-8/utf-32/Punycode/Base64)：
http://tools.jb51.net/transcoding/decode_encode_tool

BASE64編碼解碼工具：
http://tools.jb51.net/transcoding/base64

在線MD5/hash/SHA-1/SHA-2/SHA-256/SHA-512/SHA-3/RIPEMD-160加密工具：
http://tools.jb51.net/password/hash_md5_sha

在線sha1/sha224/sha256/sha384/sha512加密工具：
http://tools.jb51.net/password/sha_encode

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: