一、安装jsencrypt

 npm i jsencrypt

node_modules文件夹中出现jsencrypt

二、引入jsencrypt

在main.js中import:

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

三、生成公钥和私钥(服务端生成)

 // 私钥
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从接口获取):

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

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

VUE+webpack+npm项目中的RSA加解密的更多相关文章

  1. Vue项目中的RSA加解密

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

  2. C# 中使用 RSA加解密算法

    一.什么是RSA RSA公开密钥密码体制.所谓的公开密钥密码体制就是使用不同的加密密钥与解密密钥,是一种“由已知加密密钥推导出解密密钥在计算上是不可行的”密码体制. 在公开密钥密码体制中,加密密钥(即 ...

  3. Java中的RSA加解密工具类:RSAUtils

    本人手写已测试,大家可以参考使用 package com.mirana.frame.utils.encrypt; import com.mirana.frame.utils.log.LogUtils; ...

  4. Lua 中的 RSA 加解密实现

    记得之前,部门某款游戏陆陆续续收到一些玩家反馈,抱怨在登录游戏时会等待很久.初步排查后基本断定可能是此游戏的登录服务器程序某块代码有问题,于是即安排了服务器同事作排查分析但一直无果. 之后我时间有了空 ...

  5. 在SQL SERVER中实现RSA加解密函数(第二版)

    /*************************************************** 作者:herowang(让你望见影子的墙) 日期:2010.1.5 注: 转载请保留此信息 更 ...

  6. 在SQL SERVER中实现RSA加解密函数(第一版)

    /*************************************************** 作者:herowang(让你望见影子的墙) 日期:2010.1.1 注:   转载请保留此信息 ...

  7. vue+webpack+element-ui项目打包优化速度与app.js、vendor.js打包后文件过大

    从开通博客到现在也没写什么东西,最近几天一直在研究vue+webpack+element-ui项目打包速度优化,想把这几天的成果记录下来,可能对前端牛人来说我这技术比较菜,但还是希望给有需要的朋友提供 ...

  8. 用Vue-cli生成vue+webpack的项目模板怎么设置为vue1.0版本?

    用Vue-cli生成vue+webpack的项目模板 $ npm install -g vue-cli $ vue init webpack my-project $ cd my-project $ ...

  9. 在Vue&Element前端项目中,对于字典列表的显示处理

    在很多项目开发中,我们为了使用方便,一般都会封装一些自定义组件来简化界面的显示处理,例如参照字典的下拉列表显示,是我们项目中经常用到的功能之一,本篇随笔介绍在Vue&Element前端项目中如 ...

随机推荐

  1. Angular使用总结 --- 模版驱动表单

    表单的重要性就不多说了,Angular支持表单的双向数据绑定,校验,状态管理等,总结下. 获取用户输入 <div class="container-fluid login-page&q ...

  2. JAVA面试题集

    基础知识: 1.C++或Java中的异常处理机制的简单原理和应用. 当JAVA程序违反了JAVA的语义规则时,JAVA虚拟机就会将发生的错误表示为一个异常.违反语义规则包括2种情况.一种是JAVA类库 ...

  3. 排序算法的C语言实现(下 线性时间排序:计数排序与基数排序)

    计数排序 计数排序是一种高效的线性排序. 它通过计算一个集合中元素出现的次数来确定集合如何排序.不同于插入排序.快速排序等基于元素比较的排序,计数排序是不需要进行元素比较的,而且它的运行效率要比效率为 ...

  4. linux 下查看wwn号

    PC server主机与FC存储进行连接时,一般需要加装HBA卡,两者之间衔接的一个重要参数就是wwn号.redhat或suse下查看wwn号的方法如下.一.SuSE Linux 9查看 /proc/ ...

  5. AQS分析(AbstractQueuedSynchronizer)(三)

    1.AQS是什么 AQS同步器是Java并发编程的基础,从资源共享的角度分成独占和共享两种模式,像ReentrantLock.ThreadPoolExecutor.CountDownLatch等都是基 ...

  6. Ubuntu16.04下安装Hadoop

    一.记录理由 刚开始只是想要学习怎么使用Hive的.想着安装应该很简单,没想到花了整整一天的时间来安装,为了避免下次犯同样的错误,特此记录. 二.安装Hadoop 网上教你怎么安装Hadoop的文章有 ...

  7. mysql-高级操作

    主键冲突 主键冲突的时候,可以选择更新或者替换进行处理 更新 主键冲突,更新操作. Insert into 表名[(字段列表:包含主键)] values(值列表) on duplicate key u ...

  8. Spring HTTP状态码枚举值对照表

    使用Spring时总去查HTTP状态码对应的Spring枚举值的那篇代码,有点不方便,把代码拷贝出来统一替换格式做成了表格,放在这里,方便大家使用.(枚举类为HttpStatus) 枚举值 HTTP状 ...

  9. arcEngine开发之查看属性表

    这篇文章给出实现属性表功能的具体步骤,之后再对这些步骤中的代码进行分析. 环境准备 拖动TOCControl.MapControl控件到Form窗体上,然后拖动ContextMenuStrip控件至T ...

  10. Java 使用BigDecimal类处理高精度计算

    Java在java.math包中提供的API类BigDecimal,用来对超过16位有效位的数进行精确的运算.双精度浮点型变量double可以处理16位有效数,但在实际应用中,可能需要对更大或者更小的 ...