专栏首页web开发Vue项目使用AES做加密

Vue项目使用AES做加密

1、先在vue项目中安装crypto-js

2、在项目中新建一个utils.js文件

3、utils.js文件中的内容

/**
 * 工具类
 */
import Vue from 'vue'
import CryptoJS from 'crypto-js'
export default {//加密
  encrypt(word, keyStr){ 
    keyStr = keyStr ? keyStr : 'abcdefgabcdefg12';
    var key  = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
    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 : 'abcdefgabcdefg12';
    var key  = CryptoJS.enc.Utf8.parse(keyStr);//Latin1 w8m31+Yy/Nw6thPsMpO5fg==
    var decrypt = CryptoJS.AES.decrypt(word, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7});
    return CryptoJS.enc.Utf8.stringify(decrypt).toString();
  }

}

注:1、一定要在该文件中引用vue和crypto-js。2、两个方法中的第一个参数word是待加密或者解密的字符串,第二个参数keyStr是aes加密需要用到的16位字符串的key。3、如果想对一个js对象加密,需要先把该对象转成json字符串。

4、测试:

在需要使用加密解密方法的vue组件中使用import引入utils.js文件即可使用了

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • html5页面实现点击复制功能

    在实际工作中,有时候会遇到这样的需求,页面上有一个链接,不需要选中链接内容,只需要点击复制按钮,就可以把链接内容复制到剪切板。这时候可以使用clipboard插...

    用户1174387
  • VUE滚动条插件——vue-happy-scroll

    最近自己在自学vue2.0,然后就自己摸索做一个简单的后台管理系统,在做的过程中,总感觉不同浏览器自带的滚动条样式不统一,也很难看,所以就在网上找一些使用vue...

    用户1174387
  • JavaScript实现段落文本高亮

    代码: <!doctype html> <html lang="en"> <head> <meta http-equiv="Content-Type" ...

    用户1174387
  • 【融资愈艰】初创公司必须考虑的三件事,1万多轮融资数据分析

    【新智元导读】对于大多数科技初创公司来说,募集外部资金是在构建一个成功企业的关键一步。假设一家公司能够募集到外部资金,那么外部资金的数额是否会影响到这家公司的未...

    新智元
  • 线程概念简介 什么是线程 多线程上篇(七)

    在20世纪 60年代人们提出了进程的概念后,在OS中一直都是以进程作为能拥有资源和独立运行的基本单位的。

    noteless
  • 【Rust日报】2019-09-22 - 重磅:利用 Rust,加速 numpy 栈 100x 的速度

    S3 是亚马逊的存储服务。这个库是 rust 实现的客户端,功能相当丰富,基本涵盖了 Amazon S3 的所有功能。

    MikeLoveRust
  • [译]Asp.net MVC 之 Contorllers(一)

    Asp.net MVC contorllers     在Ajax全面开花的时代,ASP.NET Web Forms 开始慢慢变得落后。有人说,Ajax已经给了...

    数据分析
  • 线程创建和运行

    有2种方法: 1.继承Thread类 2.实现Runnable接口 创建线程一(继承Thread类): public class ThreadTest1 ex...

    MonroeCode
  • 正则表达式

    简单理解就是:同一个全局匹配的正则对同一个目标串匹配后,匹配过的部分串将不再匹配。

    心谭博客
  • 谈一谈 iOS 的锁

    翻看目前关于 iOS 开发锁的文章,大部分都起源于 ibireme 的 《不再安全的 OSSpinLock》,我在看文章的时候有一些疑惑。这次主要想解决这些疑问...

    猿_人类

扫码关注云+社区

领取腾讯云代金券