uniapp AES 加密解密

1. uniapp AES 加密解密

1.1. 引入crypto-js

需要在uniapp项目根目录里,打开命令行,执行如下命令:

javascript 复制代码
npm install crypto-js

1.2. 在项目根目录,创建一个utils文件夹,并创建一个aesEndecryptHelper.js文件

javascript 复制代码
import CryptoJS from 'crypto-js';
let ivStr = 'yyuuide45678'; // 矢量
let keyStr = "kexieapp@M2JXU1N"// 加密密钥
/**
 * AES加解密工具类
 */

/**
 * 加密
 */
const aes_encrypt = (word) => {
    keyStr = keyStr ? keyStr : 'sabcderw7894';
    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();
};


/**
 * 解密
 */
const aes_decrypt = (word) => {
    console.log('===decryptword===',word);
    keyStr = keyStr ? keyStr : 'sabcderw7894';
    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();
};

export default {
    aes_encrypt: aes_encrypt,
    aes_decrypt: aes_decrypt,
}

1.3. 在项目根目录,创建一个utils文件夹,并创建一个aesEndecryptHelper.js文件

javascript 复制代码
<template>
  <view>
    <view class="">加密:{{encrypt_str}}</view>
    <view class="">解密:{{decrypt_str}}</view>
  </view>
</template>

<script>
import aesEndecryptHelper from '../../../helper/aesEndecryptHelper.js';
export default {

  data() {
    return {
      str: 'Hello123',
      encrypt_str: '',
      decrypt_str: '',
    }
  },
  mounted() {

    let encrypt_str = aesEndecryptHelper.aes_encrypt("123456");
    let decrypt_str = aesEndecryptHelper.aes_decrypt(encrypt_str);
    this.encrypt_str=encrypt_str;
    this.decrypt_str=decrypt_str;
  },
  methods: {

  }
}
</script>
相关推荐
小时前端1 小时前
微信小程序选不了本地文件?用 web-view + H5 一招搞定
前端·微信小程序·uni-app
Mr_li18 小时前
给 Vue 开发者的 uni-app 快速指南
vue.js·uni-app
anyup20 小时前
🔥2026最推荐的跨平台方案:H5/小程序/App/鸿蒙,一套代码搞定
前端·uni-app·harmonyos
Mintopia2 天前
Vue3 项目如何迁移到 uni-app x:从纯 Web 到多端应用的系统指南
uni-app
Mintopia2 天前
uni-app x 发展前景技术分析:跨端统一的新阶段?
uni-app
不爱说话郭德纲3 天前
告别漫长的HbuilderX云打包排队!uni-app x 安卓本地打包保姆级教程(附白屏、包体积过大排坑指南)
android·前端·uni-app
Scout-leaf3 天前
WPF新手村教程(三)—— 路由事件
c#·wpf
用户298698530143 天前
程序员效率工具:Spire.Doc如何助你一键搞定Word表格排版
后端·c#·.net
HashTang4 天前
【AI 编程实战】第 12 篇:从 0 到 1 的回顾 - 项目总结与 AI 协作心得
前端·uni-app·ai编程
JunjunZ4 天前
uniapp 文件预览:从文件流到多格式预览的完整实现
前端·uni-app