前端用crypto-js来进行加密,php使用openssl_encrypt来进行解密
项目有个需求,需要对前端提交的密码进行加密传输,防止请求被拦截导致密码的泄露。
1、考虑到性能问题,不好太过的占用浏览器资源,我就直接采用了对称加密的方式(aes)来进行处理;
2、首先来看看前端加密的情况,我采用的是crypto-js来进行加密的,附上链接https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js
3、前端加密
// 需要加密的数据
let data = '123456';
// 我采用的是16位的key,为了方便我前端就把key转成UTF8
let key = CryptoJS.enc.Utf8.parse('GftZqNEoBVdB2kwx');
// iv采用的是16位的,同样为了方便转成UTF8
let iv = CryptoJS.enc.Utf8.parse('3zyJFPEzh5rUeUNi');
// 加密方式使用CBC,padding偏移量设置成Pkcs7,以便和后端对应解密
let encryptData = CryptoJS.AES.encrypt(data, key, {
mode: CryptoJS.mode.CBC,
iv: iv,
padding: CryptoJS.pad.Pkcs7
});
// 这样加密就完成啦,打印下加密后的数据
console.log(encryptData.toString());
4、另附上前端解密
// 需要加密的数据
let encryptData = 'gb+0Jn9uhOmw21cDeTQRiQ==';
*// 我采用的是16位的key,为了方便我前端就把key转成UTF8
let key = CryptoJS.enc.Utf8.parse('GftZqNEoBVdB2kwx');
// iv采用的是16位的,同样为了方便转成UTF8
let iv = CryptoJS.enc.Utf8.parse('3zyJFPEzh5rUeUNi');
// 加密方式使用CBC,padding偏移量设置成Pkcs7,以便和后端对应解密
let encryptData = CryptoJS.AES.decrypt(encryptData, key, {
mode: CryptoJS.mode.CBC,
iv: iv,
padding: CryptoJS.pad.Pkcs7
});
// 这样解密就完成啦,打印下解密后的数据;记得讲解密会的数据也转成UTF8
console.log(encryptData.toString(CryptoJS.enc.Utf8));
5、php服务端解密
function aesDecrypt($data) {
// 密钥key要和前端一致,由于前端转成了UTF8的格式,这边就可以直接使用了
$cryptKey = 'GftZqNEoBVdB2kwx';
// iv也是一样要和前端一致
$iv = '3zyJFPEzh5rUeUNi';
// 然后使用openssl\_decrypt来进行解密
$decrypt = openssl\_decrypt($data, 'AES-128-CBC', $cryptKey, 0, $iv);
return $decrypt;
}
6、附上php服务端加密代码
function aesEncrypt($data) {
$cryptKey = 'GftZqNEoBVdB2kwx';
$iv = '3zyJFPEzh5rUeUNi';
$encrypt = openssl\_encrypt($data, 'AES-128-CBC', $cryptKey, 0, $iv);
return $encrypt;
}
至此完成了,对前端密码的加密传输,主要麻烦的地方在于前后端的语言不同,需要找对前后端加密方式的匹配,不然前端加密之后,后端会加密不出来。
声明:本站部分图片或文章内容来源于网络,版权归原作者所有,如有侵权,请与我联系删除。