vue——创建AES加密工具类方法(crypto)

使用较多的有两种辅助插件
方法一: jsencrypt.js(RSA)
方法二:crypto.js (AES)

crypto封装工具类方法

AES
1.对称加密:即加密和解密使用同一个密钥。
2.加密速度快
3.适合数据比较长时的使用
4.密钥长度:密钥最长只有256个bit
5.密钥管理:要求在通信前对密钥进行秘密分配,解密的私钥必须通过网络传送至加密数据接收方;
RSA
1.非对称加密:即有两个密钥,加密用公钥,解密用私钥(其中公钥可以公开)
2.加密速度慢
3.不适合大量数据文件加密
4.私钥长度:有512bit,1024bit,2048bit,4096bit,长度越长,越安全
5.密钥管理:加解密过程中不必网络传输保密的密钥;密钥管理优于AES算法;
AES+RSA:

使用AES对称密码体制对传输数据加密,同时使用RSA不对称密码体制来传送AES的密钥,就可以综合发挥AES和RSA的优点同时
避免它们缺点来实现一种新的数据加密方案

流程:
接收方创建RSA秘钥对,
发送RSA公钥给发送方,自己保留RSA私钥
发送方创建AES密钥,加密待传送的明文,之后用RSA公钥加密该密钥,
RSA公钥加密AES的密钥+AES密钥加密明文的密文----通过Internet发给---->接收方
接收方用RSA私钥解密加密的密钥,之后再用解密后的AES密钥解密数据密文,得到明文。

### 创建AES加密工具类方法(crypto)

第一步:
//安装
npm install crypto-js --save-dev
第二步:

在src文件夹中创建crypto.js
vue——创建AES加密工具类方法(crypto)_第1张图片

第三步:crypto.js
import CryptoJS from 'crypto-js'
// 加密
export default {
  encrypt (word, keyStr) {
    // word:待加密内容  keyStr:私钥
    keyStr = keyStr || 'abcdsxyzhkj12345' // 判断是否存在ksy,不存在就用定义好的key
    var key = CryptoJS.enc.Utf8.parse(keyStr)
    var srcs = CryptoJS.enc.Utf8.parse(word)
    var encrypted = CryptoJS.AES.encrypt(srcs, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })
    return encrypted.toString()
  },
// 解密
  decrypt (word, keyStr) {
    keyStr = keyStr || 'abcdsxyzhkj12345'
    var key = CryptoJS.enc.Utf8.parse(keyStr)
    var decrypt = CryptoJS.AES.decrypt(word, key, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })
    return CryptoJS.enc.Utf8.stringify(decrypt).toString()
  }
}

使用方法

1.在要使用的地方导入
  import crypto from '../utils/crypto'
如下:

vue——创建AES加密工具类方法(crypto)_第2张图片

2.函数中使用
 gg: function () {
        var userId = sessionStorage.getItem('userId')
   // 如果是对象/数组的话,需要先JSON.stringify转换成字符串
   // var encrypts = AES.encrypt(JSON.stringify(cars),keys)
   //     keys: 公钥
        let keys = 'MIGfjnLRZ/+COEROEO\n' +
          'N6chAebH7hNdGiR6NlwxPN+ZLhIaWIRxaD50eLoL/EN/7YISZmpbnbVwlueNe2x\n' +
          'Hw/4/iBxRGYotsv+fs1gdvAs7D7Nq/dwIDAQAB'
        var encrypts = crypto.encrypt(userId, keys)
        console.log('加密前:' + userId)
        console.log('加密后:' + encrypts)
        // var dess = JSON.parse(crypto.decrypt(encrypts,keys))
      },

vue——创建AES加密工具类方法(crypto)_第3张图片

你可能感兴趣的:(前端安全)