欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

 更新時間:2018年08月16日 11:07:28   作者:bEArInSPing  
這篇文章主要介紹了JS加密插件CryptoJS實現(xiàn)AES加密操作,結(jié)合實例形式分析了CryptoJS插件的具體設(shè)置與AES加密操作實現(xiàn)技巧,需要的朋友可以參考下

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

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

  • 用到的庫:CryptoJS 官方地址https://code.google.com/archive/p/crypto-js/

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

主要是兩個文件夾,components和rollups

第一個是組件,第二個是匯總。

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

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

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

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

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

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

首先把加密解密封裝好為一個模塊

//模塊初始化
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,這個是前后臺約定的,請謹(jǐn)慎。加密秘鑰要求是32位長字符串(通過md5加密確保32位,算法限制),iv初始化向量是16位長度的字符串。這兩個東西不懂的話,看看AES加密的條件。
  • 要注意的是,在加密完成后的字符串是經(jīng)過Base64加密的,也就是說,后臺解密模塊必須要求考慮字符編碼問題,這個由項目實際來決定??梢园阉绒D(zhuǎn)出UTF8的然后再傳遞給后臺。我這里后臺是介紹Base64加密后的,所以就不用轉(zhuǎn)碼了。
  • 解密之后要轉(zhuǎn)成UTF8喔,如果后臺給的數(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('前臺發(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('后臺發(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

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《JavaScript加密解密技巧匯總》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)

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

相關(guān)文章

  • Bootstrap Table從零開始

    Bootstrap Table從零開始

    Bootstrap Table從零開始,這篇文章主要介紹了Bootstrap Table的使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-06-06
  • 微信小程序在Tab的icon上顯示消息數(shù)量的方法

    微信小程序在Tab的icon上顯示消息數(shù)量的方法

    這篇文章主要介紹了微信小程序在Tab的icon上顯示消息數(shù)量的方法,首先,在app.json文件中,找到對應(yīng)的tabBar配置,本文通過示例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下
    2024-08-08
  • IE與firefox下Dhtml的一些區(qū)別小結(jié)

    IE與firefox下Dhtml的一些區(qū)別小結(jié)

    IE與Mozilla下Dhtml的一些區(qū)別小結(jié)
    2009-12-12
  • JavaScript與java語言有什么不同

    JavaScript與java語言有什么不同

    java和JavaScript是兩個不同的語言。那么這兩個語言有什么不同呢?下面小編通過本文給大家介紹下
    2016-09-09
  • JS實現(xiàn)微信

    JS實現(xiàn)微信"炸屎"大作戰(zhàn)功能

    這篇文章主要介紹了JS實現(xiàn)微信 "炸屎"大作戰(zhàn),本文通過實例代碼圖文展示給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2021-07-07
  • JavaScript實現(xiàn)隨機點名程序

    JavaScript實現(xiàn)隨機點名程序

    這篇文章主要為大家詳細(xì)介紹了JavaScript實現(xiàn)隨機點名程序,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-03-03
  • Javascript 設(shè)計模式(二) 閉包

    Javascript 設(shè)計模式(二) 閉包

    本來應(yīng)該是第二章,接口,但因為閉包實在不懂,所以先看看閉包
    2010-05-05
  • 微信小程序?qū)崿F(xiàn)的canvas合成圖片功能示例

    微信小程序?qū)崿F(xiàn)的canvas合成圖片功能示例

    這篇文章主要介紹了微信小程序?qū)崿F(xiàn)的canvas合成圖片功能,結(jié)合實例形式分析了微信小程序canvas合成圖片相關(guān)組件使用、操作步驟與注意事項,需要的朋友可以參考下
    2019-05-05
  • javascript結(jié)合canvas實現(xiàn)圖片旋轉(zhuǎn)效果

    javascript結(jié)合canvas實現(xiàn)圖片旋轉(zhuǎn)效果

    圖片的旋轉(zhuǎn)可以說是一種效果,但是逐漸旋轉(zhuǎn)已經(jīng)不單單是屬于視覺效果那個范疇,其更具有使用性,功能性。照片有時候是需要橫過來的拍的,當(dāng)我們預(yù)覽或共享到web上時需要進(jìn)行旋轉(zhuǎn)。這個操作在以往可能更多的是交給軟件去完成,然后再將旋轉(zhuǎn)到正常角度的圖片發(fā)布到web上。
    2015-05-05
  • JavaScript中的變量聲明早于賦值分析

    JavaScript中的變量聲明早于賦值分析

    JavaScript中的變量聲明早于賦值分析,需要的朋友可以參考下
    2012-03-03

最新評論