vue安装jsencrypt_vue使用JSEncrypt实现rsa加密及挂载方法

挂载全局方法

使用jsencrypt进行rsa加密

原文链接：Js参数RSA加密传输，jsencrypt.js的使用 - CSDN博客*

https://blog.csdn.net/p312011150/article/details/80264144

(原文处有一个地方不对，不需要转换+，rsa已经做过base64转码了)

1.安装依赖   npm install jsencrypt

2.在main.js引入   import { JSEncrypt } from 'jsencrypt'

3.挂载全局方法

//JSEncrypt加密方法

Vue.prototype.$encryptedData = function(publicKey, data) {

//new一个对象

let encrypt = new JSEncrypt()

//设置公钥

encrypt.setPublicKey(publicKey)

//password是要加密的数据,此处不用注意+号,因为rsa自己本身已经base64转码了,不存在+,全部是二进制数据

let result = encrypt.encrypt(password)

return result

}

//JSEncrypt解密方法

Vue.prototype.$decryptData = function(privateKey, data) {

// 新建JSEncrypt对象

let decrypt = new JSEncrypt()

// 设置私钥

decrypt.setPrivateKey(privateKey)

// 解密数据

let result = decrypt.decrypt(secretWord)

return result

}

全局混合

使用yarn安装至Vue项目

yarn add jsencrypt --dep

或者使用npm

npm install jsencrypt --dep

混入

import { JSEncrypt } from 'jsencrypt'

export const RsaMixin = {

methods: {

// 加密

encryptedData(publicKey, data) {

// 新建JSEncrypt对象

let encryptor = new JSEncrypt();

// 设置公钥

encryptor.setPublicKey(publicKey);

// 加密数据

return encryptor.encrypt(data);

},

// 解密

decryptData(privateKey,data){

// 新建JSEncrypt对象

let decrypt= new JSEncrypt();

// 设置私钥

decrypt.setPrivateKey(privateKey);

// 解密数据

decrypt.decrypt(secretWord);

}

}

}

引入

import InvoiceRecordModal from './modules/InvoiceRecordModal'

import { RsaMixin } from '@/mixins/RsaMixin'

export default {

name: "InvoiceRecordList",

//此时可以直接调用混入的方法

mixins:[RsaMixin],

data(){},

computed:{}

}

封装为单VUE文件中的方法

使用yarn安装至Vue项目

yarn add jsencrypt --dep

或者使用npm

npm install jsencrypt --dep

引入jsencrypt

import { JSEncrypt } from 'jsencrypt'

方法

methods: {

// 加密

encryptedData(publicKey, data) {

// 新建JSEncrypt对象

let encryptor = new JSEncrypt();

// 设置公钥

encryptor.setPublicKey(publicKey);

// 加密数据

return encryptor.encrypt(data);

},

// 解密

decryptData(privateKey,data){

// 新建JSEncrypt对象

let decrypt= new JSEncrypt();

// 设置私钥

decrypt.setPrivateKey(privateKey);

// 解密数据

decrypt.decrypt(secretWord);

}

}

站在巨人的肩膀上摘苹果:

链接：https://www.jianshu.com/p/084548516410 ()

https://segmentfault.com/a/1190000018896698 (全局混入以及单文件方法)

https://www.jianshu.com/p/084548516410 (全局注册)

内容来源于网络如有侵权请私信删除