uniapp如何使用crypto-js进行加密解密

在uniapp中如何正确引入和使用crypto-js库进行数据加密解密？我尝试通过npm安装后在页面引入，但运行时总是报错"crypto-js is not defined"。请问具体需要配置哪些步骤？能否提供一个完整的AES加密解密的示例代码？

2 回复

在uni-app中使用crypto-js：

  1. 安装：npm install crypto-js
  2. 引入：import CryptoJS from 'crypto-js'
  3. 使用：
    • 加密：CryptoJS.AES.encrypt('内容', '密钥').toString()
    • 解密：CryptoJS.AES.decrypt(密文, '密钥').toString(CryptoJS.enc.Utf8)

注意：H5端可直接使用，App端需配置条件编译。


在uni-app中使用crypto-js进行加密解密，需要先安装crypto-js库，然后引入并使用相关方法。

安装方法：

npm install crypto-js

使用方法：

  1. 在需要使用的页面或组件中引入：
import CryptoJS from 'crypto-js'
  1. 加密示例（AES加密）：
// 加密
encryptData(data, key) {
  const encrypted = CryptoJS.AES.encrypt(data, key).toString()
  return encrypted
}

// 解密
decryptData(encryptedData, key) {
  const decrypted = CryptoJS.AES.decrypt(encryptedData, key)
  return decrypted.toString(CryptoJS.enc.Utf8)
}
  1. 使用示例：
const key = 'your-secret-key'
const originalText = 'Hello World'

// 加密
const encrypted = this.encryptData(originalText, key)
console.log('加密结果:', encrypted)

// 解密
const decrypted = this.decryptData(encrypted, key)
console.log('解密结果:', decrypted)

其他常用加密方法：

  • MD5加密：
const hash = CryptoJS.MD5('message').toString()
  • SHA256加密：
const hash = CryptoJS.SHA256('message').toString()

注意事项：

  1. 密钥管理：建议将密钥存储在安全的地方，不要硬编码在代码中
  2. 编码问题：加解密时注意字符编码，通常使用UTF-8
  3. 平台兼容：crypto-js在H5和App端都能正常使用

完整示例：

import CryptoJS from 'crypto-js'

export default {
  methods: {
    // AES加密
    aesEncrypt(text, key) {
      return CryptoJS.AES.encrypt(text, key).toString()
    },
    
    // AES解密
    aesDecrypt(encryptedText, key) {
      const bytes = CryptoJS.AES.decrypt(encryptedText, key)
      return bytes.toString(CryptoJS.enc.Utf8)
    }
  }
}

这样就可以在uni-app中实现数据的加密解密功能了。

回到顶部