今天总算有时间了，赶快写写，项目结束这么久，再不写忘完啦

废话少说，直接上

遇到的问题：

在vue项目中如何使用RSA进行加密？

解决思路：

 使用jsencrypt进行加密。一般是客户端初始化时访问登录服务时，服务端面动态生成一对RSA对，公钥传给客户端，客户端拿到后，用户输入密码后，点登录时用公钥加密返回给服务端，服务端用私钥解就行了。

解决方法：

一、安装依赖

npm install jsencrypt --save

二、 main.js中引用依赖

import JSEncrypt from 'jsencrypt';
 
Vue.prototype.$getRsaCode = function(str){ // 注册方法
  let encryptStr = new JSEncrypt();
  let pubKey = `rqerewrrrweqrwqewrwqrerwqrsfsafafsafsafqrewqrwqrqwreqer`; //后台给的公钥
  encryptStr.setPublicKey(pubKey); // 设置 加密公钥
  //str是需要加密的密码，rsa本身已经base64转码一次。因为密码是number类型，所以需要toString
  let  newData = encryptStr.encrypt(str.toString());  // 进行加密
  return newData;
}

三、使用加密方法

methods: {
    getPass() {
      let rasUserName = this.$getRsaCode(this.userName); // ras加密用户名
      let rasPw = this.$getRsaCode(this.password); // ras加密密码
      login({userName:rasUserName,password:rasPw}).then(res => {}).catch(err =>{});// 请求
    },
}

以上是原文，拉一份以防万一

自我应用

接下来是我自己对于上述内容的应用

简单讲述应用

我负责登录这块儿，安全起见，只要是关于密码的接口请求，密码全部用RSA加密

以下是应用

不好意思，各位老爷，不想吃官司，我只展示关键字部分吧

1.步骤1

截屏2022-11-08 11.24.58.png

const key = ' xxxxxxxxxx ';  // 这个是公钥，后端会给你

import {JSEncrypt} from 'jsencrypt';

export function passwordEncryption(password: string) {

console.log('后台公钥===》', key);

let encryptor = new JSEncrypt();

encryptor.setPublicKey(key);

let passwordEncryp = encryptor.encrypt(password);

return passwordEncryp

}

在utils里直接进行封装

将其封装成组件内的一个方法

2.步骤2

在需要用的地方引入

截屏2022-11-08 14.01.25.png


// 引入方法使用
import { passwordEncryption } from '@/utils/crypto';


// 注册接口

const handleRegistered = () => {

console.log('registeredform: ', registeredform);

// 加密函数使用

const password = passwordEncryption(registeredform.pwd);

registeredAPI({ ...registeredform, pwd: password, repwd: '' }).then(res => {

// console.log('res: ', res);

if (res.code === '200' && res.message === '添加用户成功') {

message.success('注册成功');

loginhandle(); // 跳转登录页面

registeredformRef.value.resetFields(); // 清空form表单内数据，是ant下的 form的方法

} else {

message.success('注册失败');

}

})

}

基本就是这样

有什么问题欢迎指正

感谢🙏各位开源的前辈

接下来接力棒由我们后辈接过.

加油开源，兄弟们，ei，ei， owwwwwwwwwwwwww!!!!!

RSA加密

二、 main.js中引用依赖

三、 使用加密方法

自我应用

1.步骤1

2.步骤2

三、使用加密方法