您现在的位置是:首页 > 网站制作 > vue.js心得vue.js心得

前端提交数据rsa加密

蒙xs2021-08-17【vue.js心得】人已围观

简介vue

vue使用rsa加密

1.1 安装jsencrypt,执行以下命令

npm install jsencrypt --save-dev

1.2 安装encryptlong,执行以下命令:

npm i encryptlong -S

2,创建rsa.js文件 引入‘jsencrypt’,‘encryptlong’

/* 产引入jsencrypt实现数据RSA加密 */
import JSEncrypt from 'jsencrypt' // 处理长文本数据时报错 jsencrypt.js Message too long for RSA
/* 产引入encryptlong实现数据RSA加密 */
import Encrypt from 'encryptlong' // encryptlong是基于jsencrypt扩展的长文本分段加解密功能。

准备publicKey(公钥)&& privateKey(私钥)// 密钥对生成地址 http://web.chacuo.net/netrsakeypair


// 公钥key
const publicKey = '30819f300d06092a864886f70d010101050003818d0030818902818100c95095aa5f892c20d095bc0b9c045aa00842c0f406c5c4d34823b693892168bbcb49b2933bd8e8e5ad2387e09f486bb257b7bcd52612f4a7d6af683a269829cd434e8cb4549837eae717d10fb5efab872f260a2ec75a5aeb9d23152e7966cc391afeedff7d72e8ea7e56921eb4ffc4984a63db1bb84f1e469aa9dd1dda20a72b0203010001'
// 私钥key
const privateKey = '30820275020100300d06092a864886f70d01010105000482025f3082025b02010002818100c95095aa5f892c20d095bc0b9c045aa00842c0f406c5c4d34823b693892168bbcb49b2933bd8e8e5ad2387e09f486bb257b7bcd52612f4a7d6af683a269829cd434e8cb4549837eae717d10fb5efab872f260a2ec75a5aeb9d23152e7966cc391afeedff7d72e8ea7e56921eb4ffc4984a63db1bb84f1e469aa9dd1dda20a72b02030100010281805c7a926653c0d5eeb52333e139689ea1096a70ed28f74cf5aa1c0dd1349b8e5b4685b26d047f1e6df3dd709bf54ff57955e667ee9ab0f686eb8e6498e205e09d440b2e3b66369c158be116d4d3c041865df9b87b2213c7b1e4db2b978037bf0ca8dfa51e91371adaa8fad4ad0dd90800982f40e44478b7ffeca675c69b94a451024100e4f1222a967c58bf145c183cbc3510897b8e04ce42056ac40bf9ef6649b41357c94d0ec843997307f5295d4dc6688313f306c0904b4f2f0c49afe3bd7049d277024100e11b90798c6ebe062767544c88978b458aa428e9dc7739ad4044b620cacdf4b90c56e305fd34f032bd82996938b011de22681053e79bd8c60dc7bbaaecba69ed02402769636a55719e8d7661cc42585c0236c8b0501f79ba19011ad6b1e1b7fa6a0208c35d321881080e6ca3ec4e0143e89cbc8f8302d414139357f4118e8110144d0240715cdc4919fbbb1e8641772683b32da3fbc9e800bdd21cedaeebeb7c6025901490ae40ee0731ddb4efd31146f811532e36cd894b77dbf832e545acb0cb3ea59102406021a20de1831dd21c05d2c9bcd784d9ee3076700ef4df2d9e5ac9cf98c909ce5ebebea29445417a18d2631b4ca4ed4edab8fc57af1180e797cf2ed58e16139a'

3 写完整的加密解密函数

export default {
  /* JSEncrypt加密 */
  rsaPublicData(data) {
    var jsencrypt = new JSEncrypt()
    jsencrypt.setPublicKey(publicKey)
    // 如果是对象/数组的话,需要先JSON.stringify转换成字符串
    var result = jsencrypt.encrypt(data)
    return result
  },
  /* JSEncrypt解密 */
  rsaPrivateData(data) {
    var jsencrypt = new JSEncrypt()
    jsencrypt.setPrivateKey(privateKey)
    // 如果是对象/数组的话,需要先JSON.stringify转换成字符串
    var result = jsencrypt.encrypt(data)
    return result
  },
  /* 加密 */
  encrypt(data) {
    const PUBLIC_KEY = publicKey
    var encryptor = new Encrypt()
    encryptor.setPublicKey(PUBLIC_KEY)
    // 如果是对象/数组的话,需要先JSON.stringify转换成字符串
    const result = encryptor.encryptLong(data)
    return result
  },
  /* 解密 - PRIVATE_KEY - 验证 */
  decrypt(data) {
    const PRIVATE_KEY = privateKey
    var encryptor = new Encrypt()
    encryptor.setPrivateKey(PRIVATE_KEY)
    // 如果是对象/数组的话,需要先JSON.stringify转换成字符串
    var result = encryptor.decryptLong(data)
    return result
  }
}

4在main.js主文件引入,将Rsa注册为公共方法,方便其他页面调用

  1. import Rsa from "@/utils/rsa.js"
  2. Vue.prototype.Rsa = Rsa // 将Rsa注册为公共方法,方便其他页面调用
完整rsa.js文件

在*.vue 页面使用RSA加解密(demo)

      let data = '123456789'
      let data1 = this.Rsa.encrypt(data)//加密
      let data2 = this.Rsa.decrypt(data1)//解密
      console.log(data)
      console.log(data1)
      console.log(data2)

来自https://blog.csdn.net/qq_25623257/article/details/109775531#t2

Tags:

很赞哦! ()

上一篇:js循环数据

下一篇:vue自定义封装组件

文章评论

    共有条评论来说两句吧...

    用户名:

    验证码:

站点信息

  • 建站时间:2019-1-11
  • 文章统计142篇文章
  • 标签管理标签云
  • 统计数据百度统计
  • 建站,写前端联系我:扫描二维码,