AES加密而後ajax傳輸數據

時間 2019-12-10

原文原文鏈接

　　最近作的一個項目，須要對傳輸的參數進行aes加密，因此就順便的瞭解了一下，由於這種東西，確定都是有寫好的，現成的，全部這裏就簡單的記錄一下，方便之後本身和你們查找。javascript

首先附上百度的關於AES的百度百科連接，若是以爲看的不是很明白的話，這裏有一個漫畫版的。而後在附上一個在線的加密解密的網站連接。方便你們自行的查詢與應用。好的廢話很少說，下面直接上代碼。php

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6  
 7 </head>
 8  
 9 <!--<script src="https://sellpow-html.oss-cn-beijing.aliyuncs.com/public/js/aes.js"></script>-->
10 <!--<script src="https://cdn.bootcss.com/aes-js/3.1.2/index.js"></script>-->
11 <script src="http://react.file.alimmdn.com/aes.js" type="text/javascript" charset="utf-8"></script>
12 <body>
13   
14 <script>
15     var key = CryptoJS.enc.Utf8.parse("8NONwyJtHesysWpM");//密鑰
16     var plaintText = '{"a":1}'; // 須要傳輸的明文 
17     var encryptedData = CryptoJS.AES.encrypt(plaintText, key, {
18         mode: CryptoJS.mode.ECB,//這裏是選擇的模式
19         padding: CryptoJS.pad.Pkcs7//這裏也是選擇的一個模式
20     });
21     console.log("加密前："+plaintText);
22     console.log("加密後："+encryptedData);
23  
24     encryptedData = encryptedData.ciphertext.toString();
25     var encryptedHexStr = CryptoJS.enc.Hex.parse(encryptedData);
26     var encryptedBase64Str = CryptoJS.enc.Base64.stringify(encryptedHexStr);
27  
28     var decryptedData = CryptoJS.AES.decrypt(encryptedBase64Str, key, {
29         mode: CryptoJS.mode.ECB,
30         padding: CryptoJS.pad.Pkcs7
31     });
32  
33     var decryptedStr = decryptedData.toString(CryptoJS.enc.Utf8);
34  
35     console.log("解密後:"+decryptedStr);
36 
37     var pwd = "PCsUFtgog9/qpqmqXsuCRQ==";
38     //加密服務端返回的數據
39     var decryptedData = CryptoJS.AES.decrypt(pwd, key, {
40         mode: CryptoJS.mode.ECB,
41         padding: CryptoJS.pad.Pkcs7
42     });
43     
44     console.log("解密服務端返回的數據:"+decryptedStr);
45  
46 </script>
47 </body>
48 </html>

　　我在這個程序中使用的是ECB模式，因此就沒有什麼偏移量的問題了，若是大家使用的是其餘的模式，請增長偏移量。css

這裏須要特別說明一點，就是在加密之後的數據，並非一個字符串的格式，不信的話，你們能夠直接打印一下 decryptedStr 這個變量，這個是一個對象的格式。請看下面的截圖。上面程序中的打印，會把原來的數據轉換成字符串，因此你們應該直接打印console.log(decryptedStr)
html

因此在傳輸的時候，請把他轉換爲字符串。參見如下代碼：java

 1     $.ajax({
 2         type:"post",
 3         url:"http://192.168.1.250/WxAssistBackstage/index.php/otheraction/chuiniu/do_apply",
 4         async:true,
 5         data:{
 6             data:encryptedData.toString()//轉換成爲字符串再傳輸
 7         },
 8         success:function(data){
 9             console.log(data)
10         }
11     });

若是不轉換的話，就會報錯，我把報錯信息給你們貼出來。這個報錯信息仍是第一次見到。react

jquery.min.js:4 Uncaught RangeError: Maximum call stack size exceeded
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)
at Function.x.extend.x.fn.extend (jquery.min.js:4)jquery