简单说说CryptoJS

• CryptoJS是什么？

• 在vue中如何使用CryptoJS？

• 步骤1：安装CryptoJS
• 步骤2：在Vue组件中引入CryptoJS
• 步骤3：使用CryptoJS进行加密操作
• 步骤4：使用CryptoJS进行解密操作

• CryptoJS常用操作

• 对称加密：

• AES 加密/解密

• 哈希函数：

• MD5 哈希
• SHA-1 哈希
• SHA-256 哈希

• HMAC（基于密钥的哈希函数）：

• HMAC-MD5
• HMAC-SHA1

• Base64 编码/解码：

• Base64 编码
• Base64 解码

• 扩展前端使用CryptoJS加密解密举例

• 安装crypto-js；
• 新建unit.js写成公共方法；

• 扩展：CryptoJS-中文文档

CryptoJS是什么？

CryptoJS是一个流行的JavaScript加密库，用于提供各种加密算法的实现，包括MD5、SHA-1、SHA-256、AES等。

它可以帮助开发者在前端实现数据加密、解密和哈希等操作。

在vue中如何使用CryptoJS？

在Vue中使用CryptoJS可以通过以下步骤：

步骤1：安装CryptoJS

首先，在Vue项目中安装CryptoJS，你可以使用npm或者yarn来进行安装：

npm install crypto-js

或者

yarn add crypto-js

步骤2：在Vue组件中引入CryptoJS

在需要使用CryptoJS的Vue组件中，通过import语句引入需要的加密算法，例如：

import CryptoJS from 'crypto-js';

步骤3：使用CryptoJS进行加密操作

现在你可以在Vue组件中使用CryptoJS提供的加密算法进行加密操作，例如：

// 使用MD5对字符串进行加密
let encrypted = CryptoJS.MD5('Hello, CryptoJS!').toString();
console.log(encrypted);

步骤4：使用CryptoJS进行解密操作

如果需要解密数据，同样可以使用CryptoJS提供的相关算法进行解密操作。

需要注意的是，由于前端JavaScript环境的限制，一些高级的加密操作（如对称加密）可能需要在后端完成，前端只负责传输和展示加密数据。

以上是在Vue中使用CryptoJS的基本步骤。

更多详细内容，请微信搜索“前端爱好者“， 戳我查看 。

CryptoJS常用操作

CryptoJS 提供了一系列常用的加密和哈希算法，包括对称加密、哈希函数、消息认证码等。以下是 CryptoJS 中常用操作的一些示例：

对称加密：

AES 加密/解密

var ciphertext = CryptoJS.AES.encrypt('my message', 'secret key 123').toString();
var bytes  = CryptoJS.AES.decrypt(ciphertext, 'secret key 123');
var originalText = bytes.toString(CryptoJS.enc.Utf8);

哈希函数：

MD5 哈希

var hash = CryptoJS.MD5('Message');

SHA-1 哈希

var hash = CryptoJS.SHA1('Message');

SHA-256 哈希

var hash = CryptoJS.SHA256('Message');

HMAC（基于密钥的哈希函数）：

HMAC-MD5

var hash = CryptoJS.HmacMD5("Message", "Secret Passphrase");

HMAC-SHA1

var hash = CryptoJS.HmacSHA1("Message", "Secret Passphrase");

Base64 编码/解码：

Base64 编码

var encoded = CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse('Hello, World!'));

Base64 解码

var decoded = CryptoJS.enc.Utf8.stringify(CryptoJS.enc.Base64.parse('SGVsbG8sIFdvcmxkIQ=='));

以上是 CryptoJS 中一些常用的操作示例，该库还提供了更多的加密算法和功能，可以根据具体需求查阅官方文档或者相关资料进行深入学习和使用。

扩展前端使用CryptoJS加密解密举例

安装crypto-js；

npm install crypto-js --save-dev
yarn add crypto-js --dev

新建unit.js写成公共方法；

const CryptoJS = require('crypto-js');
//16位十六进制数作为密钥（秘钥为随机生成，必须与后端保持一致！）
const key = CryptoJS.enc.Utf8.parse("xxxxxxxxxxxxxx");
//16位十六进制数作为密钥偏移量（秘钥为随机生成，必须与后端保持一致！）
const iv = CryptoJS.enc.Utf8.parse('xxxxxxxxxxxxxx');

//加密方法
function Encrypt(word) {
  const data = JSON.stringify(word);
  const srcs = CryptoJS.enc.Utf8.parse(data);
  /**
   * CipherOption, 加密的一些选项:
   *   mode: 加密模式, 可取值(CBC, CFB, CTR, CTRGladman, OFB, ECB), 都在 CryptoJS.mode 对象下
   *   padding: 填充方式, 可取值(Pkcs7, AnsiX923, Iso10126, Iso97971, ZeroPadding, NoPadding), 都在 CryptoJS.pad 对象下
   *   iv: 偏移量, mode === ECB 时, 不需要 iv
   *     返回的是一个加密对象
   */
  let encrypted = CryptoJS.AES.encrypt(srcs, key, {
      iv: iv,
      mode: CryptoJS.mode.CBC,
      padding: CryptoJS.pad.Pkcs7
  });
  //将结果进行base64加密
  return encrypted.ciphertext.toString(CryptoJS.enc.Base64);
}



// aes解密
function decrypt(word) {
  const encryptedHexStr = CryptoJS.enc.Base64.parse(word);
  const srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);
  const decrypt = CryptoJS.AES.decrypt(srcs, key, {
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  });
  const decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
  return decryptedStr.toString();
}