VUE+webpack+npm项目中的RSA加解密

时间：2021-02-01 07:40:53

一、安装jsencrypt

 npm i jsencrypt

VUE+webpack+npm项目中的RSA加解密

node_modules文件夹中出现jsencrypt

二、引入jsencrypt

在main.js中import：

 import JsEncrypt from 'jsencrypt'

 Vue.prototype.$jsEncrypt = JsEncrypt

VUE+webpack+npm项目中的RSA加解密

三、生成公钥和私钥（服务端生成）

 // 私钥

 openssl genrsa -out rsa_1024_priv.pem 1024

 // cat rsa_1024_priv.pem 读取私钥内容

 // 公钥

 openssl rsa -pubout -in rsa_1024_priv.pem -out rsa_1024_pub.pem

 // cat rsa_1024_pub.pem 读取公钥内容

四、JSEncrypt实例化（此部分可做成工具类，供项目中各模块使用）

 // 实例化一个JSEncrypt对象

 let jse = new this.$jsEncrypt.JSEncrypt()

 jse.setPublicKey(`-----BEGIN PUBLIC KEY-----

 MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC8ygMKjJLSUpnfXqt8lRSAdDxA

 HWKi9GbTFkCbAjkRCR6VUakxxXLXHQUtPCizKcvNpuYqZ5bO8LEgpY7SL3JEdEI9

 OuMnZ6ToeHPfcHeS+EgN0oYmdQ49RB5wZkcBEFk80OBEAM6VhnE0IuHGkU5ko9oP

 Hq3boEQ3Ej6r3T+UhQIDAQAB

 -----END PUBLIC KEY-----`)

五、加解密（公钥加密，私钥解密）

 // 设置需要加密的字符串

 let encrypted = jse.encrypt('Hello, world')

 // 输出加密结果

 console.log(encrypted)

 // 设置密钥

 jse.setPrivateKey(`-----BEGIN RSA PRIVATE KEY-----

 MIICXgIBAAKBgQC8ygMKjJLSUpnfXqt8lRSAdDxAHWKi9GbTFkCbAjkRCR6VUakx

 xXLXHQUtPCizKcvNpuYqZ5bO8LEgpY7SL3JEdEI9OuMnZ6ToeHPfcHeS+EgN0oYm

 dQ49RB5wZkcBEFk80OBEAM6VhnE0IuHGkU5ko9oPHq3boEQ3Ej6r3T+UhQIDAQAB

 AoGBAIO8JwEedHlE4FBovBsT4Bl+gmhu2NxC1NlpBq3jkDSd+3RQZlLvp6IJgwo8

 l13lxWv8kVF3tVkzxTW1sQJjz0RYShH8vXLl94gf6mFkJbeOPP6uA0mGDG81yINw

 KUpE0RM6ZM9yKEeVdK3u67TkEBcC6Td5KBl8Yof3q7qxiOWhAkEA4BXEtpnfhgm3

 7s1VjDxdIHTtWL1PihMT+SCOqp+Vv27ABVrxtDW/w2R3ZzR5ezROI2v1DVhj5wvs

 xPGXx6OpSQJBANetVvazS/5SQNvb+Cmjw9Rt5NilyxfX5IsSswaIojbwhZY2FVZy

 AlFH9K/YS2FYFyU7iIqN6IIkOxXpOcj/bV0CQQCRYM4MgWuotClmfkSgBJGOew14

 4uj1dUch+2NTgtFOLvXZA5WICs7sXwOwKzUdH2QKSwHitJOr0+q6ItsLpDwxAkBX

 zvDK+/CCmIZjfMkqWsxN3nf/ZHCtQm5/2Jsem94/M+mPYHGLgltDMGKEfTEjbrPt

 qrFKh8ATzCBqKUwncybZAkEAmVNW1dftWWoriZZXXMvfFkTDgYvRmytoVEThhnd0

 J/AOhZiUAs9+kHfGKivlTE209AY6Bw8aRzuTCziSwQhhBQ==

 -----END RSA PRIVATE KEY-----`)

 // 解密加密过的字符串

 let decrypted = jse.decrypt(encrypted)

 // 打印结果

 console.log(decrypted)

我在项目中的使用如下图（this.publicKey从接口获取）：

VUE+webpack+npm项目中的RSA加解密

以上为我的使用方式，欢迎大家批评指正~

参考地址：http://travistidwell.com/jsencrypt/#

相关文章