Vue使用JSEncrypt实现rsa加密及挂载方法


Posted in Javascript onFebruary 07, 2020

挂载全局方法

使用jsencrypt进行rsa加密

原文链接:Js参数RSA加密传输,jsencrypt.js的使用 *
https://3water.com/article/179813.htm
(原文处有一个地方不对,不需要转换+,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);
  }
 }
}

引入

<script>
 import InvoiceRecordModal from './modules/InvoiceRecordModal'
 import { RsaMixin } from '@/mixins/RsaMixin'

 export default {
 name: "InvoiceRecordList",
 //此时可以直接调用混入的方法
 mixins:[RsaMixin],
 data(){},
 computed:{}
 }
</script>

封装为单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);
 }
 }

总结

以上所述是小编给大家介绍的Vue使用JSEncrypt实现rsa加密及挂载方法,希望对大家有所帮助!

Javascript 相关文章推荐
关于Javascript与iframe的那些事儿
Jul 04 Javascript
node.js中的emitter.on方法使用说明
Dec 10 Javascript
JS动态修改iframe高度和宽度的方法
Apr 01 Javascript
JavaScript判断前缀、后缀是否是空格的方法
Apr 15 Javascript
浅析AngularJs HTTP响应拦截器
Dec 28 Javascript
基于javascript实现简单计算器功能
Jan 03 Javascript
Boostrap模态窗口的学习小结
Mar 28 Javascript
基于JavaScript实现验证码功能
Apr 01 Javascript
JS设计模式之命令模式概念与用法分析
Feb 06 Javascript
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
Aug 20 Javascript
javascript移动端 电子书 翻页效果实现代码
Sep 07 Javascript
详解如何使用Node.js实现热重载页面
May 06 Javascript
jQuery实现获取多选框的值示例
Feb 07 #jQuery
微信小程序canvas开发水果老虎机的思路详解
Feb 07 #Javascript
Node.js 在本地生成日志文件的方法
Feb 07 #Javascript
node.js 微信开发之定时获取access_token
Feb 07 #Javascript
jQuery操作选中select下拉框的值代码实例
Feb 07 #jQuery
webpack的 rquire.context用法实现工程自动化的方法
Feb 07 #Javascript
详解为element-ui的Select和Cascader添加弹层底部操作按钮
Feb 07 #Javascript
You might like
php跨站攻击实例分析
2014/10/28 PHP
PHP实现微信网页授权开发教程
2016/01/19 PHP
PHP文件上传之多文件上传的实现思路
2016/01/27 PHP
Yii视图CGridView实现操作按钮定义地址示例
2016/07/14 PHP
PHP中strtr与str_replace函数运行性能简单测试示例
2019/06/22 PHP
防止页面被iframe(兼容IE,Firefox火狐)
2010/07/04 Javascript
用jquery与css打造个性化的单选框和复选框
2010/10/20 Javascript
jQuery获得包含margin的outerWidth和outerHeight的方法
2015/03/25 Javascript
详解JavaScript的另类写法
2016/04/11 Javascript
Jquery attr()方法 属性赋值和属性获取详解
2016/04/15 Javascript
原生js实现class的添加和删除简单代码
2016/07/12 Javascript
基于Angular中ng-controller父子级嵌套的相关属性详解
2018/10/08 Javascript
使用vue中的混入mixin优化表单验证插件问题
2019/07/02 Javascript
vue中通过使用$attrs实现组件之间的数据传递功能
2019/09/01 Javascript
用Python编写一个基于终端的实现翻译的脚本
2015/04/24 Python
pymssql数据库操作MSSQL2005实例分析
2015/05/25 Python
Saltstack快速入门简单汇总
2016/03/01 Python
解决Python字典写入文件出行首行有空格的问题
2017/09/27 Python
Python callable()函数用法实例分析
2018/03/17 Python
python tools实现视频的每一帧提取并保存
2020/03/20 Python
如何用Python做一个微信机器人自动拉群
2019/07/03 Python
使用Python代码实现Linux中的ls遍历目录命令的实例代码
2019/09/07 Python
python 两个数据库postgresql对比
2019/10/21 Python
使用OpenCV circle函数图像上画圆的示例代码
2019/12/27 Python
windows下python安装pip方法详解
2020/02/10 Python
亚瑟士美国官网:ASICS美国
2017/02/01 全球购物
通信工程专业女生个人求职信
2013/09/21 职场文书
营销与策划个人求职信
2013/09/22 职场文书
鞋类设计与工艺专业销售求职信
2013/11/01 职场文书
总经理秘书工作职责
2013/12/26 职场文书
计算机学生求职信范文
2014/01/30 职场文书
党风廉设责任书
2014/04/16 职场文书
奖金申请报告模板
2015/05/15 职场文书
golang switch语句的灵活写法介绍
2021/05/06 Golang
MySQL 开窗函数
2022/02/15 MySQL
Windows server 2016服务器基本设置
2022/08/14 Servers