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>
相关推荐
hez20106 小时前
在 .NET 上构建超大托管数组
c#·.net·.net core·gc·clr
宸翰14 小时前
解决 uni-app App 端 vue-i18n 占位符丢失:封装跨端可用的 tf 格式化方法
前端·vue.js·uni-app
时光足迹1 天前
uni-app 视频通话实战:康复师与患者视频问诊的 6 个致命 Bug 与解决方案
android·ios·uni-app
时光足迹2 天前
腾讯云 TRTC UniApp SDK 从入门到上线
前端·vue.js·uni-app
时光足迹2 天前
uni-app 里把加密视频嵌入页面播放?我分析了 4 种方案,只有 1 种接近完美
前端·vue.js·uni-app
时光足迹2 天前
JPush UniApp UTS 插件完全参考手册:API、事件与厂商通道一网打尽
vue.js·ios·uni-app
时光足迹2 天前
极光推送全攻略(下):uni-app 代码实现与 iOS 排查实战
vue.js·ios·uni-app
时光足迹2 天前
极光推送全攻略(上):被iOS证书折磨了三天,我写了一份前端也能看懂的避坑指南
前端·ios·uni-app
spmcor4 天前
身份证读卡“无感登录”方案实践:从手动点击到自动检测
uni-app
PedroQue994 天前
uni-router v1.8.0新增冷启动守卫补执行
前端·uni-app