CryptoJS - GitHub文檔
CryptoJS - Bootcdn 在線地址
Base64 編碼
window.btoa 對字符串進(jìn)行 base64編碼(注意不能編碼中文);
winodw.atob 對 base64字符串 進(jìn)行解碼(對于包含中文的 base64編碼,不能正確解碼);
通常的方法是通過 window.btoa() 方法對源數(shù)據(jù)進(jìn)行編碼, 然后接收方使用 window.atob() 方法對其進(jìn)行解碼, 從而得到原數(shù)據(jù)掸茅。但是這種方法存在的問題是:window.btoa() 不支持中文, window.atob() 轉(zhuǎn)換含有中文的 base64編碼 的時候中文部分會變?yōu)閬y碼椅邓。另一個存在的問題是解碼github的readme數(shù)據(jù)的時候也是亂碼。經(jīng)過查找相關(guān)資料發(fā)現(xiàn)了 Base64的編碼與解碼轉(zhuǎn)的最優(yōu)方案:
// 編碼
function utf8_to_b64(str) {
return window.btoa(unescape(encodeURIComponent(str)));
}
// 解碼
function b64_to_utf8(str) {
return decodeURIComponent(escape(window.atob(str)));
}
// Usage:
utf8_to_b64('? à la mode'); // 4pyTIMOgIGxhIG1vZGU=
b64_to_utf8('4pyTIMOgIGxhIG1vZGU='); // "? à la mode"
utf8_to_b64('I \u2661 Unicode!'); // SSDimaEgVW5pY29kZSE=
b64_to_utf8('SSDimaEgVW5pY29kZSE='); // "I ? Unicode!"
utf8_to_b64('我愛中國'); // 5oiR54ix5Lit5Zu9
b64_to_utf8('SSDimaEgVW5pY29kZSE='); // "我愛中國"
utf8_to_b64(123456); // MTIzNDU2
b64_to_utf8("MTIzNDU2"); // 123456
使用CryptoJS處理base64加密解密(常用)
//base64加密
function base64_encode(code){
var str = CryptoJS.enc.Utf8.parse(code);
return CryptoJS.enc.Base64.stringify(str);
}
//base64解密
function base64_decode(code){
var words = CryptoJS.enc.Base64.parse(code);
return words.toString(CryptoJS.enc.Utf8)
}
AES 加密
安裝
$ npm install crypto-js
aes加密: crypto.js
import CryptoJS from "crypto-js";
const key = CryptoJS.enc.Utf8.parse("1234567890000000"); //16位
const iv = CryptoJS.enc.Utf8.parse("1234567890000000");
export default {
//aes加密
encrypt(word) {
let encrypted = "";
if (typeof word == "string") {
const srcs = CryptoJS.enc.Utf8.parse(word);
encrypted = CryptoJS.AES.encrypt(srcs, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
} else if (typeof word == "object") {
//對象格式的轉(zhuǎn)成json字符串
const data = JSON.stringify(word);
const srcs = CryptoJS.enc.Utf8.parse(data);
encrypted = CryptoJS.AES.encrypt(srcs, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
}
return encrypted.ciphertext.toString();
},
// aes解密
decrypt(word) {
const encryptedHexStr = CryptoJS.enc.Hex.parse(word);
const srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);
const decrypt = CryptoJS.AES.decrypt(srcs, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
const decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
return decryptedStr.toString();
}
};
使用
import Crypto from "@/utils/crypto";
Crypto.encrypt("? à la mode"); // b915bf40c4795227488da86978f55fce
Crypto.decrypt(userPwd); // "? à la mode"
Crypto.encrypt("? à la mode"); // 6317313288b32bf1909f165ec530d60a
Crypto.decrypt(userPwd); // "I ? Unicode!"
Crypto.encrypt("我愛中國"); // 1898a34273855f55255437aa22f87504
Crypto.decrypt(userPwd); // "我愛中國"
Crypto.encrypt("123456"); // dd7a6c4edc68e683b700a7a2846a2bc6
Crypto.decrypt(userPwd); // "123456"
前后端數(shù)據(jù)通信參數(shù)加密
加密代碼實現(xiàn):
項目中需要將所有傳到后臺的參數(shù)分5個步驟處理:
第一步:排序
第二步:將排序好的參數(shù)進(jìn)行MD5加密作為接口的簽名
第三步:將排序好的參數(shù)和接口簽名拼接上進(jìn)行AES加密
第四部:將AES加密后的密文Base64加密
第五步:將最終的密文encodeURIComponent昧狮;
代碼如下:
function encryption(data) {
let strs=[];
for(let i in data){
strs.push(i+'='+data[i]);
}
strs.sort(); // 數(shù)組排序
strs=strs.join('&'); // 數(shù)組變字符串
let endData=strs+'&sign='+CryptoJS.MD5(strs+'ADfj3kcadc2349akvm1CPFFCD84f').toString(); // MD5加密
let key = CryptoJS.enc.Utf8.parse("0880076B18D7EE81"); // 加密秘鑰
let iv = CryptoJS.enc.Utf8.parse("CB3EC842D7C69578"); // 矢量
let encryptResult = CryptoJS.AES.encrypt(endData,key, { // AES加密
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7 // 后臺用的是pad.Pkcs5,前臺對應(yīng)為Pkcs7
});
return encodeURIComponent(CryptoJS.enc.Base64.stringify(encryptResult.ciphertext)); // Base64加密encode;
}
加密最終的密文拼接在接口地址后面景馁,請求接口。后臺返回的數(shù)據(jù)也是密文陵且;解密方法如下:
function decryption(data) {
let key = CryptoJS.enc.Utf8.parse("0880076B18D7EE81"); // 加密秘鑰
let iv = CryptoJS.enc.Utf8.parse("CB3EC842D7C69578"); // 矢量
let baseResult=CryptoJS.enc.Base64.parse(data); // Base64解密
let ciphertext=CryptoJS.enc.Base64.stringify(baseResult); // Base64解密
let decryptResult = CryptoJS.AES.decrypt(ciphertext,key, { // AES解密
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
let resData=decryptResult.toString(CryptoJS.enc.Utf8).toString();
return JSON.parse(resData);
}
備注:因為后臺返回的數(shù)據(jù)是json格式裁僧;所以做種return的時候使用JSON.parse();如果解密的目標(biāo)為字符串,比如說需要解密的是一個加密的token值慕购。那就要做相應(yīng)的改動:
function decryption(data) {
let key = CryptoJS.enc.Utf8.parse("0880076B18D7EE81"); // 加密秘鑰
let iv = CryptoJS.enc.Utf8.parse("CB3EC842D7C69578"); // 矢量
let baseResult=CryptoJS.enc.Base64.parse(data); // Base64解密
let ciphertext=CryptoJS.enc.Base64.stringify(baseResult); // Base64解密
let decryptResult = CryptoJS.AES.decrypt(ciphertext,key, { // AES解密
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
return CryptoJS.enc.Utf8.stringify(decryptResult);
}
原文出處:http://www.sosout.com/2018/09/05/cryptojs-tutorial.html