<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button type="submits" οnclick="displayDate()" >点击</button>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
<script>
function displayDate(){
let obj = JSON.stringify({
username: 'name',
password: 'word111',
code: 'code'
})
let key = CryptoJS.enc.Utf8.parse('word123123') // 加密解密钥匙 CryptoJS会根据key 进行加密解密
let srcs = CryptoJS.enc.Utf8.parse(obj)
let encrypted = CryptoJS.AES.encrypt(srcs, key, {mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7}).toString() // mode: ase加密模式ecb 还可选CryptoJS.mode.CBC... padding:填充内容
console.log(encrypted,'加密数据')
let Data = CryptoJS.enc.Utf8.stringify(CryptoJS.AES.decrypt(encrypted, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })).toString()
console.log(Data,'解密数据')
}
</script>
</html>
vue 写法
先安装npm install crypto-js
在需要页面引入 import CryptoJS from "crypto-js";
moutend(){ var obj = JSON.stringify({ username: 'name', password: 'word111', code: 'code' }) // 加密 var key = CryptoJS.enc.Utf8.parse('word123123') let srcs = CryptoJS.enc.Utf8.parse(obj) let encrypted = CryptoJS.AES.encrypt(srcs, key, {mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7}).toString() console.log(encrypted,'加密数据') let Data = CryptoJS.enc.Utf8.stringify(CryptoJS.AES.decrypt(encrypted, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })).toString()console.log(Data,'解密数据')
}
结果
加个获取crypto-js版本引用的线上地址 https://cdnjs.com/libraries/crypto-js