基于VUE的前端crypto-js aes加密与解密
生活随笔
收集整理的這篇文章主要介紹了
基于VUE的前端crypto-js aes加密与解密
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
2019獨角獸企業重金招聘Python工程師標準>>>
第一步: npm install?crypto-js --save
第二步:在utils文件夾下新建secret.js文件,封裝公共方法。
密鑰可由服務端返回
const CryptoJS = require('crypto-js'); //引用AES源碼js const key = CryptoJS.enc.Utf8.parse("1234123412ABCDEF"); //十六位十六進制數作為密鑰 const iv = CryptoJS.enc.Utf8.parse('ABCDEF1234123412'); //十六位十六進制數作為密鑰偏移量//加密方法 export function Encrypt(word){let srcs = CryptoJS.enc.Utf8.parse(word);let encrypted = CryptoJS.AES.encrypt(srcs, key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 });return encrypted.ciphertext.toString().toUpperCase(); } //解密方法 export function Decrypt(word){let encryptedHexStr = CryptoJS.enc.Hex.parse(word);let srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);let decrypt = CryptoJS.AES.decrypt(srcs, key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 });let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);return decryptedStr.toString(); }第三步:使用引用
1.加密頁面
<script> import { Encrypt } from '../../utils/secret.js' export default {created(){this.encryptionName = Encrypt(this.username) // 加密用戶名this.getList()} } </script>2.解密頁面
<script> import { Decrypt } from '../../utils/secret.js' export default {created(){this.encryptionName = Decrypt(this.username) // 解密用戶名} } </script>完成!
原理實現推薦這篇文章:AES加密算法的詳細介紹與實現
轉載于:https://my.oschina.net/lemonfive/blog/2962495
總結
以上是生活随笔為你收集整理的基于VUE的前端crypto-js aes加密与解密的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: django-重写登录认证(可以使用用户
- 下一篇: 打印modal框中在线生成的二维码