Vue中获取RSA并进行数据加密

1.先通过接口获取RSA公钥

 对应组件中的代码：

// 获取RSA并存储在本地
async mounted() {
  this.RSA = await getRsa()
    .then((res) => res.data.data)
    .catch((err) => err)
    console.log('获取RSA', this.RSA)
    localStorage.setItem('RSA', this.RSA)
}

  api文件夹中的代码 ：

import axios from 'axios'
// 获取RSA
export function getRsa() {
    return axios({
        url: '/user/rsa',
        method: 'GET'
    })
}

 2.引入jsencrypt

npm install jsencrypt --save

 3.在main.js中引入

import JsEncrypt from 'jsencrypt'
Vue.prototype.$jsEncrypt = JsEncrypt

4.在对应组件引入并使用

import JsEncrypt from 'jsencrypt'

const publicKey = this.RSA // 从服务器端获取到RSA加密公钥
const encrypt = new JSEncrypt()
encrypt.setPublicKey(publicKey)
const originalData = '需要加密的数据'
console.log('加密前的数据：', originalData)
const encryptedData = encrypt.encrypt(originalData)
console.log('加密后的数据：', encryptedData)

5.报错"JSEncrypt is not defined"

1.删除node_modules包

2.package.json修改：“jsencrypt”: “3.0.0-rc.1”

3.重新安装依赖包：npm i

4.重启项目