vue使用jsencrypt實(shí)現(xiàn)rsa前端加密的操作代碼
更新時(shí)間：2023年09月06日 14:44:45 作者：范特西是只貓
這篇文章主要介紹了vue使用jsencrypt實(shí)現(xiàn)rsa前端加密,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
實(shí)現(xiàn) RSA 加密
介紹 vue 完成 rsa 加密傳輸，
jsencrypt實(shí)現(xiàn)參數(shù)的前端加密
1 安裝 jsencrypt
npm install jsencrypt
2 編寫 jsencrypt.js
- 在
utils文件夾中新建jsencrypt.js文件，內(nèi)容如下： - 注意點(diǎn)：一般公鑰都是后端生成好的，之間給到前端，需要注意的需要讓后端把生成的公鑰放入
.txt文件中。把.txt文件給前端，否則可能會出現(xiàn)無法使用的可能
import JSEncrypt from "jsencrypt/bin/jsencrypt.min";
// 密鑰對生成 http://web.chacuo.net/netrsakeypair
// 公鑰進(jìn)行加密（后端給前端的公鑰）
// 測試數(shù)據(jù)
const publicKey =
"MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAoZFKd5QKsXGcYa0SHVsy\n" +
"Mmtw6ODLpi0KAX3VyYKnlFcUa3T7NSiWEvozm+Pe2KGFP/QOtxo4Psg5RzhGC9Rk\n" +
"R15ZiaySq7uOEIPmLXFG46tItCPt3r+JS0ycCTX7QGkOX5jN/tLkuEV482anH/qi\n" +
"bRbh9Vajh9axxxxxxxxxx2K+M7PNN0z4P8944zVN4Z0LoXnPZ9x511VMRzWyAgJU\n" +
"700j6l1Uwx+Cw0sBY379XW8jkBTqq/wQ1RBOCbLT0jgKql+cPVJ6Exqu6sMIKtKH\n" +
"sueLOAQh31kosj8QXvhf+21+YOkoKLXxMRyw4WD7HOBXHQZp0q6+Em4ZmpvltPhm\n" +
"vwIDAQAB";
// 私鑰進(jìn)行解密
const privateKey = "";
// 加密
export function encrypt(txt) {
const encryptor = new JSEncrypt();
encryptor.setPublicKey(publicKey); // 設(shè)置公鑰
return encryptor.encrypt(txt); // 對數(shù)據(jù)進(jìn)行加密
}
// 解密
export function decrypt(txt) {
const encryptor = new JSEncrypt();
encryptor.setPrivateKey(privateKey); // 設(shè)置私鑰
return encryptor.decrypt(txt); // 對數(shù)據(jù)進(jìn)行解密
}3. 頁面使用
import { encrypt, decrypt } from "@/utils/jsencrypt";
// 請求參數(shù)
let params = {
username: "admin",
password: encrypt(123456),//對123456進(jìn)行rsa加密
};
到此這篇關(guān)于vue使用jsencrypt實(shí)現(xiàn)rsa前端加密的操作代碼的文章就介紹到這了,更多相關(guān)vue rsa前端加密內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue根據(jù)進(jìn)入的路由進(jìn)行原路返回的方法
今天小編就為大家分享一篇vue根據(jù)進(jìn)入的路由進(jìn)行原路返回的方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
本篇文章主要介紹了vue 2.0封裝model組件的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
Vue在項(xiàng)目中如何引入本地Json數(shù)據(jù)
這篇文章主要介紹了Vue在項(xiàng)目中如何引入本地Json數(shù)據(jù)問題,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-11-11
這篇文章主要介紹了Vue列表渲染的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)簡單購物車小案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-10-10
vue.js基于v-for實(shí)現(xiàn)批量渲染 Json數(shù)組對象列表數(shù)據(jù)示例
這篇文章主要介紹了vue.js基于v-for實(shí)現(xiàn)批量渲染 Json數(shù)組對象列表數(shù)據(jù),結(jié)合實(shí)例形式分析了vue.js使用v-for遍歷json格式數(shù)據(jù)渲染列表相關(guān)操作技巧,需要的朋友可以參考下2019-08-08
淺談vue中document.getElementById()拿到的是原值的問題
這篇文章主要介紹了淺談vue中document.getElementById()拿到的是原值的問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要給大家介紹了關(guān)于vue3中refs用法舉例的相關(guān)資料,Vue.js中的$refs是一個(gè)對象,它持有已注冊過ref特性的所有組件和元素,需要的朋友可以參考下2023-08-08
這篇文章主要為大家詳細(xì)介紹了vue視頻時(shí)間進(jìn)度條組件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
vue項(xiàng)目設(shè)置scrollTop不起作用(總結(jié))
這篇文章主要介紹了vue項(xiàng)目設(shè)置scrollTop不起作用(總結(jié))，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12