vue項目之前端CryptoJS加密、解密代碼示例
更新時間:2024年11月04日 09:58:11 作者:大個個個個個兒
在Vue項目中集成CryptoJS進行數(shù)據(jù)加密,首先需要通過npm安裝CryptoJS安裝包,然后在項目文件中引入CryptoJS,文中通過代碼介紹的非常詳細,需要的朋友可以參考下
1、vue項目需要安裝CryptoJS安裝包
npm install crypto-js
2、在項目中引入CryptoJS
import CryptoJS from 'crypto-js'
3、使用,代碼如下
// 此處key為16進制 let key = 'jiajiajiajiajiajiajiajia'; console.log('密鑰:', key); // key格式化處理 key = CryptoJS.enc.Utf8.parse(key) // 偏移量長度為16位, 注:偏移量需要與后端定義好,保證一致 let iv = "37fa77f6a3b0462d"; iv = CryptoJS.enc.Utf8.parse("37fa77f6a3b0462d"); // 加密內(nèi)容 const source = { "username": "用戶名", "password": "密碼", "timestamp": new Date().getTime() } const content = JSON.stringify(source); console.log('加密前:', source); // 加密方法 const encryptedContent = CryptoJS.AES.encrypt(content, key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 }) const encStr = encryptedContent.ciphertext.toString() console.log("加密后:", encStr); // 解密方法 const decryptedContent = CryptoJS.AES.decrypt(CryptoJS.format.Hex.parse(encStr), key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 }) console.log('解密:',CryptoJS.enc.Utf8.stringify(decryptedContent));
總結
到此這篇關于vue項目之前端CryptoJS加密、解密的文章就介紹到這了,更多相關前端CryptoJS加密、解密內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
您可能感興趣的文章:
- js前端加密庫Crypto-js進行MD5/SHA256/BASE64/AES加解密的方法與示例
- JavaScript實現(xiàn)的前端AES加密解密功能【基于CryptoJS】
- JS使用插件cryptojs進行加密解密數(shù)據(jù)實例
- VueJs里利用CryptoJs實現(xiàn)加密及解密的方法示例
- 使用JS前端加密庫sm-crypto實現(xiàn)國密sm2、sm3和sm4加密與解密
- 前端CryptoJS加密、后端JAVA解密代碼實現(xiàn)參考
- vue項目中使用crypto-js實現(xiàn)加密解密方式
- JS使用 cryptojs加密解密(對稱加密庫)的問題
- vue用CryptoJS加密,java用CryptoUtil解密
- crypto-js對稱加密解密的使用方式詳解(vue與java端)
相關文章
Vue3頁面數(shù)據(jù)加載延遲的問題分析和解決方法
在?Vue?3?的項目中,當我們使用響應式數(shù)據(jù)(如?ref?或?computed)來管理頁面狀態(tài)時,可能會遇到由于接口數(shù)據(jù)加載延遲,導致頁面初始渲染時數(shù)據(jù)尚未獲取完成的問題,本文針對此問題簡單分析了原因和解決方法,需要的朋友可以參考下2024-11-11更強大的vue ssr實現(xiàn)預取數(shù)據(jù)的方式
這篇文章主要介紹了更強大的 vue ssr 預取數(shù)據(jù)的方式,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-07-07