HTML使用 crypto-js-AES 加密

HTML引入crypto-js.min.js

<script src="https://cdn.bootcss.com/crypto-js/3.1.9-1/crypto-js.min.js"></script>

vue安装crypto-js

npm install crypto-js

加解密方法

const key = CryptoJS.enc.Utf8.parse("1234567890hijklm"); // 十六位十六进制数作为密钥
const iv = CryptoJS.enc.Utf8.parse('1234567890abcdef'); // 十六位十六进制数作为密钥偏移量
/* 加密方法 */
function myEncrypt(word) {const srcs = CryptoJS.enc.Utf8.parse(word);const encrypted = CryptoJS.AES.encrypt(srcs, key, {iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.Pkcs7});return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
}
/* 解密方法 */
function myDecrypt(word) {const encryptedHexStr = CryptoJS.enc.Base64.parse(word);const srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);const decrypt = CryptoJS.AES.decrypt(srcs, key, {iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.Pkcs7});const decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);return decryptedStr.toString();
}

使用

const inputVal = '12345'; // 加密内容
let encPwd = myEncrypt(inputVal); // 加密方法
encPwd = JSON.stringify(encPwd); // 将JavaScript对象转换为字符串
encPwd = JSON.parse(encPwd); // 将字符串解析为JavaScript对象
const decPwd = myDecrypt(encPwd); // 解密方法
const UGC = '原内容：' + inputVal; // 原内容
const nencrypted = '加密后：' + encPwd; // 加密后
const decrypted = '解密后：' + decPwd; // 解密后
document.getElementById('box').innerHTML = UGC + '<br />' + nencrypted + '<br />' + decrypted;

完整代码

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>crypto-js-AES加密</title><!-- 加密 --><script src="https://cdn.bootcss.com/crypto-js/3.1.9-1/crypto-js.min.js"></script></head><body><input type="text" id="frame" placeholder="请输入加密内容" /><button id="btn">加密</button><div id="box" style="margin-top: 20px"></div></body><script>document.getElementById("btn").onclick = function() {const inputVal = document.getElementById("frame").value; // 加密内容if (!inputVal) {alert('请输入加密内容');return;}let encPwd = myEncrypt(inputVal); // 加密方法encPwd = JSON.stringify(encPwd); // 将JavaScript对象转换为字符串encPwd = JSON.parse(encPwd); // 将字符串解析为JavaScript对象const decPwd = myDecrypt(encPwd); // 解密方法const UGC = '原内容：' + inputVal; // 原内容const nencrypted = '加密后：' + encPwd; // 加密后const decrypted = '解密后：' + decPwd; // 解密后document.getElementById('box').innerHTML = UGC + '<br />' + nencrypted + '<br />' + decrypted;};</script><!-- CryptoJS.js --><script>const key = CryptoJS.enc.Utf8.parse("1234567890hijklm"); // 十六位十六进制数作为密钥const iv = CryptoJS.enc.Utf8.parse('1234567890abcdef'); // 十六位十六进制数作为密钥偏移量/* 加密方法 */function myEncrypt(word) {const srcs = CryptoJS.enc.Utf8.parse(word);const encrypted = CryptoJS.AES.encrypt(srcs, key, {iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.Pkcs7});return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);}/* 解密方法 */function myDecrypt(word) {const encryptedHexStr = CryptoJS.enc.Base64.parse(word);const srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);const decrypt = CryptoJS.AES.decrypt(srcs, key, {iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.Pkcs7});const decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);return decryptedStr.toString();}</script>
</html>

更多加密方法可参考：

JS中利用CryptoJS进行MD5/SHA256/BASE64/AES加密解密的方法与示例

HTML使用 crypto-js-AES 加密相关推荐

js aes加密_某高考咨询网js逆向分析笔记
一.某高考资讯网逆向分析某网站的js加密分析,安全签名signsafe + HmacSHA1 + AES 一年前分析过网站数据还没有加密,最近需要获取新的数据发现原先的爬虫失效,请求和响应都经过加密 ...
js aes加密_nodejs中使用Crypto-JS对图片进行加解密
在用nodejs开发后台的时候,为了安全的需要,经常会有加密的需求,对前端传入的图片进行AES加密后存储,然后在前端调用的时候,对图片进行解密,并返回Base64编码格式的图片. Crypto-JS这 ...
前端使用crypto.js进行加密学习记录
因为我的需求是加密可逆,具有一定的安全性(对安全性要求不高),所以使用DES或AES即可,我用的是AES js下载下载 Nodejs后端:对用户密码进行加密 - WJY- - 博客园Nodejs后端 ...
JS AES加密与PHP解密(转)
网页端(在没有https情况下)给密码之类的加密传输,虽然多此一举,也好过直接监控软件就能看到密码思路在传输密码的时候,先向后台获取一个随机码或者验证码,作为秘钥,网页端根据这个秘钥,加密要传输的 ...
【安全与协议】使用crypto.js进行加密详解
JavaScript Crypto-JS 前言与工具 → 前言使用 Crypto-JS 可以非常方便地在 JavaScript 进行 MD5.SHA1.SHA2.SHA3.RIPEMD-160 哈希 ...
前端用crypto.js进行加密和解密
import CryptoJS from 'crypto-js' function getAesString(data,key,iv){//加密var key = CryptoJS.enc.Utf8. ...
npm aes 加密（js aes 加密）
加密 function encryption(plaintText) { //明文var plaintText = plaintText;// ECB加密var options = {mode: Cr ...
python aes padding_使用PKCS7Padding在python和Node.js之间进行AES加密
已解决密码学Python 使用PKCS7Padding在python和Node.js之间进行AES加密10 我试图用Node.js中的pkcs7填充来解密消息没有成功. 此消息已加密并从Python ...
js逆向加密五邑大学教务系统密码AES实现模拟登录（仅供参考）
最近下班无聊,就看了一下之前写的教务系统模拟登录代码(python-爬虫),整体逻辑大概自己总结了一下: 1.请求验证码图片. 2.对输入的密码进行加密. 3.封装账号,密码,验证码,发送post请求 ...
微信小程序使用crypto.js加密解密
微信小程序中使用crypto.js crypto.js是用来进行AES加密的注意AES在使用时有7个配置项,前后端加解密记着统一参数,测试时注意配置项的选择是否一致. 测试工具: AES加密测试工具 ...

HTML使用 crypto-js-AES 加密

HTML引入crypto-js.min.js

vue安装crypto-js

加解密方法

使用

完整代码

HTML使用 crypto-js-AES 加密相关推荐

最新文章

热门文章