使用crypto-js库进行加密/解密
安装
npm install crypto-js
基本使用
<template><div>使用crypto-js库进行加密/解密</div>
</template><script setup>
import CryptoJS from 'crypto-js';
import { onMounted } from 'vue';// 加密函数
const encryptMessage = (message, key) => {// AES 加密const ciphertext = CryptoJS.AES.encrypt(message, key).toString();return ciphertext;
}// 解密函数
const decryptMessage = (ciphertext, key) => {// AES 解密const bytes = CryptoJS.AES.decrypt(ciphertext, key);const originalText = bytes.toString(CryptoJS.enc.Utf8);return originalText;
}// 要加密的原始消息和密钥
const originalMessage = 'Hello, world!';
const encryptionKey = 'goto_w'; // 16 bytes (128 bits)onMounted(() => {// 加密消息const encryptedMessage = encryptMessage(originalMessage, encryptionKey);console.log('加密后的消息:', encryptedMessage);// 解密消息const decryptedMessage = decryptMessage(encryptedMessage, encryptionKey);console.log('解密后的消息:', decryptedMessage);
})
</script>
封装成一个工具函数,支持常见的数据类型(字符串,数组,对象)
// 导入 CryptoJS 模块
import CryptoJS from 'crypto-js';/*** @description: 加解密函数* @param {*} data 需要加密的数据* @param {*} key 加密密钥* @return {*} 返回加密后的数据*/// 加密函数
function encrypt(data, key) {// 将不同类型的数据转换为字符串const dataString = JSON.stringify(data);// AES 加密const ciphertext = CryptoJS.AES.encrypt(dataString, key).toString();return ciphertext;
}// 解密函数
function decrypt(ciphertext, key) {// AES 解密const bytes = CryptoJS.AES.decrypt(ciphertext, key);const decryptedString = bytes.toString(CryptoJS.enc.Utf8);// 将 JSON 字符串转换回原始数据const decryptedData = JSON.parse(decryptedString);return decryptedData;
}export { encrypt, decrypt };
使用加密/解密的工具函数
<template><div>使用crypto-js库进行加密/解密</div>
</template><script setup>
import { onMounted } from 'vue';
import { encrypt, decrypt } from '@/utils/crypto';onMounted(() => {const ciphertext = encrypt({ name: 'goto_w', age: 18 }, 'goto_w')console.log(ciphertext);const decryptedData = decrypt(ciphertext, 'goto_w')console.log(decryptedData);
})
</script>