AES加密的使用

对数据传输加密、解密处理---AES.js

第一步:

在vue中安装crypto-js依赖

npm install crypto-js --save-dev

第二步:

在static目录下新建一个AES.js文件,例如:

第三步:

在AES.js中填写如下代码

import CryptoJS from "crypto-js";
// npm install crypto-js --save-dev
//随机生成指定数量的32进制key
export default {
generatekey(num) {
let library =
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let key = "";
for (var i = 0; i < num; i++) {
let randomPoz = Math.floor(Math.random() * library.length);
key += library.substring(randomPoz, randomPoz + 1);
}
return key;
},
//加密
encrypt(word, keyStr) {
keyStr = keyStr ? keyStr : "CXMGNcYwTrtsadQmV935ONNXMUycpG1g"; //判断是否存在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 ? keyStr : "CXMGNcYwTrtsadQmV935ONNXMUycpG1g";
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();
}
};
第四步:

在需要使用加密的地方引入

import AES from "@/common/AES.js";
第五步:

调用

//如果是对象/数组的话,需要先JSON.stringify转换成字符串
//调用加密方法
var encrypts = AES.encrypt(JSON.stringify(cars),keys);
//调用解密方法
var dess = JSON.parse(AES.decrypt(encrypts,keys));
console.log(encrypts)
console.log(encrypts.length)
console.log(dess)

vue使用AES.js的更多相关文章

  1. vue中使用AES.js和crypto.js加密

    一:crypto-js加密 1.1:安装依赖 npm install crypto-js --save-dev 1.2 :在项目目录上创建一个js文件里面写入加密,解密的代码 mport Crypto ...

  2. 前端(小程序)项目Aes.js/Md5.js加密的处理方法

    做项目中需要对前端数据加密传输这个时候需要用到前端加密的算法主要是:Aes.js,Md5.js 一.Vue项目用到的aes.js加密. 1.直接在index.html引入aes.js或者在npm in ...

  3. Vue过渡效果之JS过渡

    前面的话 与CSS过渡不同,JS过渡主要通过事件进行触发.本文将详细介绍Vue过渡效果之JS过渡 事件钩子 JS过渡主要通过事件监听事件钩子来触发过渡,共包括如下的事件钩子 <transitio ...

  4. 使用 Vue 和 epub.js 制作电子书阅读器

    ePub 简介 ePub 是一种电子书的标准格式,平时我看的电子书大部分是这种格式.在手机上我一般用"多看"阅读 ePub 电子书,在 Windows 上找不到用起来比较顺心的软件 ...

  5. socket应用(vue、node.js、M站)

    socket应用(vue.node.js.M站) 前言:我们在做一些项目的时候需要做到实时变化, 比如我们有时候有需求会要求我们做一个类似于聊天室的页面 比如有些时候我们对某些东西进行点赞和刷票,需要 ...

  6. vue项目中主要文件的加载顺序(index.html、App.vue、main.js)

    先后顺序: index.html > App.vue的export外的js代码 > main.js > App.vue的export里面的js代码 > Index.vue的ex ...

  7. vue.runtime.esm.js:593 [Vue warn]: Invalid prop: custom validator check failed for prop "value".报错解决

    在uni中使用 picker组件,一直报错 vue.runtime.esm.js:593 [Vue warn]: Invalid prop: custom validator check failed ...

  8. 最新的vue没有dev-server.js文件,如何进行后台数据模拟?

    https://blog.csdn.net/qq_34645412/article/details/78833860 https://blog.csdn.net/qq_34645412/article ...

  9. vue中使用js动画与velocity.js

    一:vue中使用js动画 根据上一篇安装animate.css之后 vue中有动画的钩子函数,@before-enter是内容由无到有的时候自动监听触发的函数,函数会接收到参数el,这样可以动态设置样 ...

随机推荐

  1. 后端开发应该掌握的Redis基础

    转自:https://juejin.im/post/5d078cd6f265da1b8466e62c 在上一篇文章中,我们简单地讲了一下Redis的应用场景.安装.如何连接等比较基础的知识,那么在这篇 ...

  2. [ASP.NET MVC]EntityFramework离线部署

    根据项目需要可能会需要离线开发或者网速不好的情况下,很难配置EF,这种情况下就进行离线配置 (1)下载离线EF包: EF6.0的packages,百度网盘链接:https://pan.baidu.co ...

  3. 大数据学习之 LINUX

    ##大数据学习 古斌6.6 01. linux系统的搭建: 选用 Contos 6.5 x64位系统 (CentOS-6.5-x86_64-minimal.iso) 我选择的为迷你版 模板机: bla ...

  4. Mysql的undo、redo、binlog的区别

      与不同引擎的关系 核心作用 生命周期   日志类型 undo log 属于innodb引擎独有 回滚,保证事务的"原子性",事务日志  事务开始前,以类似"快照&qu ...

  5. Spring Mvc原理分析(一)

    Servlet生命周期了解 Servlet的生命(周期)是由容器(eg:Tomcat)管理的,换句话说,Servlet程序员不能用代码控制其生命. 加载和实例化:时机取决于web.xml的定义,如果有 ...

  6. Qt中QOpengl的QMatrix4x4矩阵作用原理以及使用方法

    1.矩阵具有坐标变换的作用,例如:左乘一个旋转矩阵,实现点的坐标旋转,左乘一个平移矩阵实现,点的平移 2.一个点可以同时串联相乘几个变换矩阵,实现坐标连续变换,根据左乘规则,右边矩阵先作用于点,作用顺 ...

  7. 微信小程序 image 组件 src 请求不能设置 header 的问题

    只能先 wx.downloadFile 得到 tempFilePath,然后设置 src = tempFilePath

  8. unity渲染篇:烘焙模型贴图

    今天要来做一件有趣的事情,那就是把一个模型数据烘焙到贴图上! 什么意思?就是下面酱紫,把这只小喵从第一张图拍扁,变成第二张图的样子(似乎有点残忍~) 可能你经常会从美术那边听到"烘焙光照贴图 ...

  9. 使用easyui为tab页增加右键菜单

    在使用easyui进行上左右布局一文中,我们已经使用easyui搭建起了一个简单的上左右布局.在使用的过程中,我们经常会遇到tab页打开的太多,但只能一个一个的关闭的烦恼,这个时候有没有想到eclip ...

  10. git各种操作:基本操作 and 多人协作 and 冲突解决

    git基本操作 git 上次文件到远程仓库(参考:https://blog.csdn.net/beiqiaofeng123/article/details/104859326) 如果第一次上传,配置一 ...