本文目錄一覽:
- 1、關於 vue中使用crypto-js,進行DES 的加密解密
- 2、node.js的crypto怎麼用
- 3、記錄一下前端使用CryptoJS的幾種加密方式
- 4、vue+typescript如何使用crypto-js
- 5、如何使用CryptoJS的AES方法進行加密和解密
- 6、前端使用crypto.js進行加密
關於 vue中使用crypto-js,進行DES 的加密解密
安裝: npm install crypto-js –save
在utils文件夾中新建secret.js文件,內容:
message: 需要加解密的文本
key: 加解密的秘鑰
iv: 偏移量,最短8位數,ecb模式不需要此參數
在vue頁面引入secret.js文件
node.js的crypto怎麼用
crypto-js aes使用前端加密php後端解密:
前端js:
script src=””/script
script src=””/script
script src=””/script
script
var key_hash = CryptoJS.MD5(“Message”);
var key = CryptoJS.enc.Utf8.parse(key_hash);
var iv = CryptoJS.enc.Utf8.parse(‘1234567812345678’);
var encrypted = CryptoJS.AES.encrypt(“Message”, key, { iv: iv,mode:CryptoJS.mode.CBC,padding:CryptoJS.pad.ZeroPadding});
document.write(“encode:”+encrypted);
/script
php代碼:
?php
$text = “Message”;
$key = md5($text); //key的長度必須16,32位,這裡直接MD5一個長度為32位的key
$iv=’1234567812345678′;
$crypttext = mcrypt_encrypt(MCRYPT_RIJNDAEL_128, $key, $text, MCRYPT_MODE_CBC, $iv);
$decode = mcrypt_decrypt(MCRYPT_RIJNDAEL_128, $key, $crypttext, MCRYPT_MODE_CBC, $iv);
echo base64_encode($crypttext);
echo “br/”;
echo $decode;
echo “br/”;
?
記錄一下前端使用CryptoJS的幾種加密方式
自己太小白了,之前在PC端項目中使用的MD5加密,現在的小程序項目使用了 CryptoJS 裡面的 enc-base64 和 hmac-sha1 ,之前沒有用到過這兩種,所以比較疑惑,為何在小程序不繼續使用 MD5 呢?所以在這裡記錄一下自己解疑惑的一些知識點。
隨著互聯網的興起,我們對信息的安全越來越受重視,這樣就導致在web開發中,對用戶密碼等各種加密變得更加重要了。與伺服器的交互中,為了確保數據傳輸的安全性,避免被黑客抓包篡改。
對於Base64編碼的,我覺得看一篇文章能夠解決你的疑惑,我在這裡就不贅述了
? Base64編碼原理
如: 用戶密碼,請求參數,文件加密
如: 介面參數簽名驗證服務
支付數據、CA數字證書
前端的朋友可能會關注前端js加密,我們在做 WEB 的登錄功能時一般是通過 Form 提交或 Ajax 方式提交到伺服器進行驗證的。為了防止抓包,登錄密碼肯定要先進行一次加密(RSA),再提交到伺服器進行驗證。一些大公司都在使用,比如淘寶、京東、新浪 等。
前端加密也有很多現成的js庫,如:
JS-RSA: 用於執行OpenSSL RSA加密、解密和密鑰生成的Javascript庫,
MD5: 單向散列加密md5 js庫,
crypto-js: 對稱加密AES js庫,
-CryptoJS (crypto.js) 為 JavaScript 提供了各種各樣的加密演算法。
HMAC 系列是消息驗證,用於驗證一個消息是否被篡改——如網站上傳遞 email 和 hmac(email),則接收時可以通過 hmac(email) 獲知 email 是否是用戶偽造的
vue+typescript如何使用crypto-js
先說重點,如果要支持ie11,crypto的版本就一定要用我寫的
“@types/crypto-js”: “^4.0.2”,
“crypto-js”: “^4.0.0”,
① 安裝
npm install crypto-js@4.0.0 —-這個一定要用這個版本,或者更低一點,再低的我沒有試,反正這個是支持ie的-如果不考慮ie就忽略
npm install –save @types/crypto-js
②創建
好了 就這樣引入啦~
③使用
簡簡單單~ 就這樣吧~
如何使用CryptoJS的AES方法進行加密和解密
首先準備一份明文和秘鑰:
var plaintText = ‘aaaaaaaaaaaaaaaa’; // 明文
var keyStr = ‘bbbbbbbbbbbbbbbb’; // 一般key為一個字元串
參看官網文檔,AES方法是支持AES-128、AES-192和AES-256的,加密過程中使用哪種加密方式取決於傳入key的類型,否則就會按照AES-256的方式加密。
CryptoJS supports AES-128, AES-192, and AES-256. It will pick the variant by the size of the key you pass in. If you use a passphrase, then it will generate a 256-bit key.
由於Java就是按照128bit給的,但是由於是一個字元串,需要先在前端將其轉為128bit的才行。
最開始以為使用CryptoJS.enc.Hex.parse就可以正確地將其轉為128bit的key。但是不然…
經過多次嘗試,需要使用CryptoJS.enc.Utf8.parse方法才可以將key轉為128bit的。好吧,既然說了是多次嘗試,那麼就不知道原因了,後期再對其進行更深入的研究。
// 字元串類型的key用之前需要用uft8先parse一下才能用
var key = CryptoJS.enc.Utf8.parse(keyStr);
由於後端使用的是PKCS5Padding,但是在使用CryptoJS的時候發現根本沒有這個偏移,查詢後發現PKCS5Padding和PKCS7Padding是一樣的東東,使用時默認就是按照PKCS7Padding進行偏移的。
// 加密
var encryptedData = CryptoJS.AES.encrypt(plaintText, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
由於CryptoJS生成的密文是一個對象,如果直接將其轉為字元串是一個Base64編碼過的,在encryptedData.ciphertext上的屬性轉為字元串才是後端需要的格式。
var encryptedBase64Str = encryptedData.toString();
// 輸出:’RJcecVhTqCHHnlibzTypzuDvG8kjWC+ot8JuxWVdLgY=
console.log(encryptedBase64Str);
// 需要讀取encryptedData上的ciphertext.toString()才能拿到跟Java一樣的密文
var encryptedStr = encryptedData.ciphertext.toString();
// 輸出:’44971e715853a821c79e589bcd3ca9cee0ef1bc923582fa8b7c26ec5655d2e06
console.log(encryptedStr);
由於加密後的密文為128位的字元串,那麼解密時,需要將其轉為Base64編碼的格式。
那麼就需要先使用方法CryptoJS.enc.Hex.parse轉為十六進位,再使用CryptoJS.enc.Base64.stringify將其變為Base64編碼的字元串,此時才可以傳入CryptoJS.AES.decrypt方法中對其進行解密。
// 拿到字元串類型的密文需要先將其用Hex方法parse一下
var encryptedHexStr = CryptoJS.enc.Hex.parse(encryptedStr);
// 將密文轉為Base64的字元串
// 只有Base64類型的字元串密文才能對其進行解密
var encryptedBase64Str = CryptoJS.enc.Base64.stringify(encryptedHexStr);
使用轉為Base64編碼後的字元串即可傳入CryptoJS.AES.decrypt方法中進行解密操作。
// 解密
var decryptedData = CryptoJS.AES.decrypt(encryptedBase64Str, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
經過CryptoJS解密後,依然是一個對象,將其變成明文就需要按照Utf8格式轉為字元串。
// 解密後,需要按照Utf8的方式將明文轉位字元串
var decryptedStr = decryptedData.toString(CryptoJS.enc.Utf8);
console.log(decryptedStr); // ‘aaaaaaaaaaaaaaaa’
前端使用crypto.js進行加密
在前端登錄記住密碼的時候需要前端來進行加密工作,接觸到crypto這個js,使用還算簡單,在這裡記錄一下
在vue框架中
安裝crypto-js
utils.js
component
key和iv都可以更換,但是需要保證的是加解密的key和iv保持一致
原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-tw/n/275715.html