VueJs里利用CryptoJs实现加密及解密

shleyZ 发布于2019-08-23 17:11 / 2992人阅读

摘要：第一步安装安装第二步创建在文件目录下创建一个文件对页面上输入的密码进行加密传输给后台进行验证，对返回的数据进行解密，在页面展示引入源码对密码进行加密，传输给后台进行验证需要加密的密码对密码加密的秘钥加密的密文加密对加密之后的密文在页面上

第一步安装
安装crypto-js

第二步创建
在js文件目录下创建一个js文件secret

/**
 * 对页面上输入的密码进行加密传输给后台进行验证，对返回的数据进行解密，在页面展示
 */
let CryptoJS = require("crypto-js"); // 引入AES源码js
export default {
/*
* 对密码进行加密，传输给后台进行验证
* @param  {String}     word    需要加密的密码
* @param  {String}     keyStr    对密码加密的秘钥
* @return {String}     加密的密文
* */
encrypt(word, keyStr) { // 加密
    keyStr = keyStr ? keyStr : "ABGHNJHGSHUYG12";
    let key = CryptoJS.enc.Utf8.parse(keyStr);
    let srcs = CryptoJS.enc.Utf8.parse(word);
    let encrypted = CryptoJS.AES.encrypt(srcs, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });
    return encrypted.toString();
},
/*
* 对加密之后的密文在页面上进行解密，以便用户进行修改
* @param  {String}     word    需要加密的密码
* @param  {String}     keyStr    对密码加密的秘钥
* @return {String}      解密的明文
* */
decrypt(word, keyStr) { // 解密
    keyStr = keyStr ? keyStr : "ABGHNJHGSHUYG12";
    let key = CryptoJS.enc.Utf8.parse(keyStr);
    let decrypt = CryptoJS.AES.decrypt(word, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
    });
    return CryptoJS.enc.Utf8.stringify(decrypt).toString();
},
};

第三步，引入
在具体的加解密模块中引入文件

并且对需要加密的密码使用加密函数进行加密

encrypt是加密函数
第一个参数是需要加密的明文
第二个参数是加密过程中使用的秘钥

我是一个小小白，谁能摸黑我快点来

GPU云服务器云服务器 php实现加密解密加密解密加密视频解密加密和解密

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/103950.html

JavaScript基于crypto-js的加密和PHP对此加密的解密及相同加密方式

摘要：合适和够用是最完美的追求。个人网站最近刚写了一个手机在线播放的电影站基于的加密和对此加密的解密及相同加密方式最近使用做了一个电影电视剧在线播放的的小站，使用到的是的进行实时抓取，其中遇到了加密的问题，遂解决之，才有了这篇总结。关于作者程序开发人员，不拘泥于语言与技术，目前主要从事PHP和前端开发，使用Laravel和VueJs，App端使用Apicloud混合式开发。合适和够用是...

xuhong 2019-06-27 16:24 评论0 收藏0
JavaScript基于crypto-js的加密和PHP对此加密的解密及相同加密方式

摘要：合适和够用是最完美的追求。个人网站最近刚写了一个手机在线播放的电影站基于的加密和对此加密的解密及相同加密方式最近使用做了一个电影电视剧在线播放的的小站，使用到的是的进行实时抓取，其中遇到了加密的问题，遂解决之，才有了这篇总结。关于作者程序开发人员，不拘泥于语言与技术，目前主要从事PHP和前端开发，使用Laravel和VueJs，App端使用Apicloud混合式开发。合适和够用是...

saucxs 2019-08-22 11:03 评论0 收藏0
一套简单的基于 RSA + AES 加密机制的前端解决方案

摘要：前言因公司现有后台管理系统项目需对部分网络请求接口的重要数据进行加密，整合了一套简单的基于加密机制的前端解决方案。用户已登录成功，页面刷新后将会重新生成，这时候需从中获取并和上传后端，后端重新绑定和。前言因公司现有后台管理系统项目需对部分网络请求接口的重要数据进行加密，整合了一套简单的基于 RSA + AES 加密机制的前端解决方案。参考文献： crypto 廖雪峰 crypt...

Travis 2019-08-23 17:58 评论0 收藏0
前端crypto-js解密报malformed utf-8 data小结

摘要：一般情况下，很少会在前端进行加解密的操作，因为没有太大的必要性，前端的代码是很容易看到的，即使这样，我觉得还是有比较处理一下的，至少不让别人一眼就看到信息我使用存储了一些用户的用户名昵称等的信息，通过进行加解密处理，这里我选用了加密算法对一般情况下，很少会在前端进行加解密的操作，因为没有太大的必要性，前端的代码是很容易看到的，即使这样，我觉得还是有比较处理一下的，至少不让别人一眼就看...

codergarden 2019-08-23 14:21 评论0 收藏0
使用crypto-js进行128位AES/ECB/PKCS7Padding加密/解密

摘要：支持多种加解密方案这里主要记录一下使用进行位的加解密前端加密是不安全的不安全的不安全的初始化一个文件直接全部回车就行啦安装在同级目录下新建一个文件写入以下内容导入包定义加解密的都放这里了加密还有啥意义设置数据块长度生成密钥字节数 crypto-js支持多种加/解密方案, 这里主要记录一下使用 crypto-js 进行 AES 128位的加/解密; 前端加密是不安全的, 不安全的, 不...

jas0n 2019-08-21 16:19 评论0 收藏0