快捷導(dǎo)航

Vue使用JSEncrypt實(shí)現(xiàn)rsa加密及掛載方法

更新時(shí)間：2020年02月07日 14:02:50 作者：未月廿三

這篇文章主要介紹了Vue使用JSEncrypt實(shí)現(xiàn)rsa加密及掛載方法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下

掛載全局方法

使用jsencrypt進(jìn)行rsa加密

原文鏈接：Js參數(shù)RSA加密傳輸，jsencrypt.js的使用 *
http://www.dbjr.com.cn/article/179813.htm
（原文處有一個(gè)地方不對(duì)，不需要轉(zhuǎn)換+，rsa已經(jīng)做過base64轉(zhuǎn)碼了）

1.安裝依賴 npm install jsencrypt 
2.在main.js引入 import { JSEncrypt } from 'jsencrypt' 
3.掛載全局方法
//JSEncrypt加密方法
Vue.prototype.$encryptedData = function(publicKey, data) {
 //new一個(gè)對(duì)象
 let encrypt = new JSEncrypt()
 //設(shè)置公鑰
 encrypt.setPublicKey(publicKey)
 //password是要加密的數(shù)據(jù),此處不用注意+號(hào),因?yàn)閞sa自己本身已經(jīng)base64轉(zhuǎn)碼了,不存在+,全部是二進(jìn)制數(shù)據(jù)
 let result = encrypt.encrypt(password)
 return result
}
//JSEncrypt解密方法
Vue.prototype.$decryptData = function(privateKey, data) {
 // 新建JSEncrypt對(duì)象
 let decrypt = new JSEncrypt()
 // 設(shè)置私鑰
 decrypt.setPrivateKey(privateKey)
 // 解密數(shù)據(jù)
 let result = decrypt.decrypt(secretWord)
 return result
}

全局混合

使用yarn安裝至Vue項(xiàng)目

yarn add jsencrypt --dep

或者使用npm

npm install jsencrypt --dep

混入

import { JSEncrypt } from 'jsencrypt'
export const RsaMixin = {
 methods: {
  // 加密
  encryptedData(publicKey, data) {
   // 新建JSEncrypt對(duì)象
   let encryptor = new JSEncrypt();
   // 設(shè)置公鑰
   encryptor.setPublicKey(publicKey);
   // 加密數(shù)據(jù)
   return encryptor.encrypt(data);
  },
  // 解密
  decryptData(privateKey,data){
   // 新建JSEncrypt對(duì)象
   let decrypt= new JSEncrypt();
   // 設(shè)置私鑰
   decrypt.setPrivateKey(privateKey);
   // 解密數(shù)據(jù)
   decrypt.decrypt(secretWord);
  }
 }
}

引入

<script>
 import InvoiceRecordModal from './modules/InvoiceRecordModal'
 import { RsaMixin } from '@/mixins/RsaMixin'

 export default {
 name: "InvoiceRecordList",
 //此時(shí)可以直接調(diào)用混入的方法
 mixins:[RsaMixin],
 data(){},
 computed:{}
 }
</script>

封裝為單VUE文件中的方法

使用yarn安裝至Vue項(xiàng)目

yarn add jsencrypt --dep

或者使用npm

npm install jsencrypt --dep

引入jsencrypt

import { JSEncrypt } from 'jsencrypt'

方法

methods: {
 // 加密
 encryptedData(publicKey, data) {
  // 新建JSEncrypt對(duì)象
  let encryptor = new JSEncrypt();
  // 設(shè)置公鑰
  encryptor.setPublicKey(publicKey);
  // 加密數(shù)據(jù)
  return encryptor.encrypt(data);
 },
 // 解密
 decryptData(privateKey,data){
  // 新建JSEncrypt對(duì)象
  let decrypt= new JSEncrypt();
  // 設(shè)置私鑰
  decrypt.setPrivateKey(privateKey);
  // 解密數(shù)據(jù)
  decrypt.decrypt(secretWord);
 }
 }

總結(jié)

以上所述是小編給大家介紹的Vue使用JSEncrypt實(shí)現(xiàn)rsa加密及掛載方法，希望對(duì)大家有所幫助！

您可能感興趣的文章: