绵阳动力网站建设

vue框架中使用JSEncrypt对信息进行加密和解密的方法及代码

时间:2023-07-31

vue框架中使用JSEncrypt对信息进行加密和解密的方法及代码

在日常网站建设开发的过程中需要对一些例如登录密码,身份证号,公司社会码等敏感信息进行本地存储时做加解密。涉及到的方法也比较多,今天和大家一起分享其中用JSEncrypt的方法来加密和解密。

通常我们都是用第三方包拿来直接用的比如jsencrypt-提供好方法,我们可以根据提供的网址跟换密钥对,具体方法如下:

1、下载安装包:

npm install jsencrypt

2、在工具文件下建包utils/jsencrypt.js-内容如下

import JSEncrypt from 'jsencrypt/bin/jsencrypt.min'

// 密钥对生成 http://web.chacuo.net/netrsakeypair

const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKoR8mX0rGKLqzcWmOzbfj64K8ZIgOdH\n' +
  'nzkXSOVOZbFu/TJhZ7rFAN+eaGkl3C4buccQd/EjEsj9ir7ijT7h96MCAwEAAQ=='

const privateKey = 'MIIBVAIBADANBgkqhkiG9w0BAQEFAASCAT4wggE6AgEAAkEAqhHyZfSsYourNxaY\n' +
  '7Nt+PrgrxkiA50efORdI5U5lsW79MmFnusUA355oaSXcLhu5xxB38SMSyP2KvuKN\n' +
  'PuH3owIDAQABAkAfoiLyL+Z4lf4Myxk6xUDgLaWGximj20CUf+5BKKnlrK+Ed8gA\n' +
  'kM0HqoTt2UZwA5E2MzS4EI2gjfQhz5X28uqxAiEA3wNFxfrCZlSZHb0gn2zDpWow\n' +
  'cSxQAgiCstxGUoOqlW8CIQDDOerGKH5OmCJ4Z21v+F25WaHYPxCFMvwxpcw99Ecv\n' +
  'DQIgIdhDTIqD2jfYjPTY8Jj3EDGPbH2HHuffvflECt3Ek60CIQCFRlCkHpi7hthh\n' +
  'YhovyloRYsM+IS9h/0BzlEAuO0ktMQIgSPT3aFAgJYwKpqRYKlLDVcflZFCKY7u3\n' +
  'UP8iWi1Qw0Y='

// 加密
export function encrypt(txt) {
  const encryptor = new JSEncrypt()
  encryptor.setPublicKey(publicKey) // 设置公钥
  return encryptor.encrypt(txt) // 对数据进行加密
}

// 解密
export function decrypt(txt) {
  const encryptor = new JSEncrypt()
  encryptor.setPrivateKey(privateKey) // 设置私钥
  return encryptor.decrypt(txt) // 对数据进行解密
}

3、在需要使用加解密的页面引入加解密方法

import { encrypt, decrypt } from "@/utils/jsencrypt";

4、在页面中使用方法 

// 加密-加密之后在存储在本地存储
encrypt(需要加密数据或变量)
// 解密
decrypt (需要解密数据或变量)

好了,今天和大家分享的关于vue框架中使用JSEncrypt对信息进行加密和解密的方法及代码就介绍结束了,你看了后喜欢的话记得收藏哦!

Copyright © 绵阳动力网站建设 www.kf51.cn All Rights Reserved 蜀ICP备08100083号

客服微信
客服微信
0816-6339181
客服微信
my_dongli