登录的时候密码使用crypto-js加密解密

news2024/10/25 14:29:41

首先要下载插件

npm install crypto-js

然后新建一个js文件 crypto.js

// 导入 CryptoJS 模块
import CryptoJS from 'crypto-js';
const secretKey="pZsgDSvzaeHWDkhLDxvrrrYvBlAsIHmZ";//一般是后端提供的
/**
 * @description: 加解密函数
 * @param {*} data 需要加密的数据
 * @param {*} key 加密密钥
 * @return {*} 返回加密后的数据
 */

// 加密函数
function encrypt(data) {
  let key = CryptoJS.enc.Utf8.parse(secretKey);
  let srcs = CryptoJS.enc.Utf8.parse(data);
  let encrypted = CryptoJS.AES.encrypt(srcs, key, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7,
  });
  return encrypted.toString();

}

// 解密函数
function decrypt(encryptStr) {
  let key = CryptoJS.enc.Utf8.parse(secretKey);
  let decrypt = CryptoJS.AES.decrypt(encryptStr, key, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7,
  });
  return CryptoJS.enc.Utf8.stringify(decrypt).toString();
}

export { encrypt, decrypt };

最后在页面导入之后使用

import { encrypt, decrypt } from '@/utils/crypto';

加密

encrypt(loginForm.password)

解密

decrypt(loginForm.password)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2223334.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

凸优化学习

认为学习凸优化理论比较合适的路径是: 学习/复习线性代数和(少量)高等数学的知识。 实际上,凸优化理论综合使用了线性代数和微积分的相关知识,比如方向导数,雅克比矩阵,海森矩阵,KKT…

大数据-189 Elasticsearch - ELK 日志分析实战 - 环境配置启动 Nginx、ZK、Kafka、ES、Kibana

点一下关注吧!!!非常感谢!!持续更新!!! 目前已经更新到了: Hadoop(已更完)HDFS(已更完)MapReduce(已更完&am…

写出Windows操作系统内核的程序员,70多岁,还去办公室敲代码

大家好,我是二哥呀。 微软前 CEO 鲍尔默曾说过一句言简意赅的话:“没有 Dave,就没有今天的微软”。 可见 Dave 在微软的分量。Dave 的全名叫 Dave Cutler,微软的超级程序员,Windows NT 操作系统内核的缔造者&#xf…

【Java】ArrayList相关操作及其案例

ArrayList相当于集合&#xff0c;作为一种容器存储数据&#xff0c;与数组类似。不同的是&#xff0c;ArrayList中长度可变&#xff0c;而数组长度不可变。 ArrayList相关API 构造器 public ArrayList() 创建一个空的集合对象 ArrayList<String>arrnew ArrayList<>…

RHCE【web服务器】

目录 一、web服务器简介 1、什么是www 2、网址及HTTP简介 3、http协议请求的工作过程&#xff1a; 二、web服务器的类型 1、仅提供用户浏览的单向静态网页 2、提供用户互动接口的动态网站 三、web服务器基本配置 四、虚拟主机配置实战 1、搭建静态网站--基于http协议…

草地杂草数据集野外草地数据集田间野草数据集YOLO格式VOC格式目标检测计算机视觉数据集

一、数据集概述 数据集名称&#xff1a;杂草图像数据集 数据集是一个包含野草种类的集合&#xff0c;其中每种野草都有详细的特征描述和标记。这些数据可以包括野草的图片、生长习性、叶片形状、颜色等特征。 1.1可能应用的领域 农业领域: 农业专家和农民可以利用这一数据集来…

Spring Boot:植物健康监测的智能先锋

摘要 随着信息技术在管理上越来越深入而广泛的应用&#xff0c;管理信息系统的实施在技术上已逐步成熟。本文介绍了植物健康系统的开发全过程。通过分析植物健康系统管理的不足&#xff0c;创建了一个计算机管理植物健康系统的方案。文章介绍了植物健康系统的系统分析部分&…

VScode分文件编写C++报错 | 如何进行VScode分文件编写C++ | 不懂也能轻松解决版

分文件编写遇到的问题 分文件编写例子如下所示&#xff1a; 但是直接使用 Run Code 或者 调试C/C文件 会报错如下&#xff1a; 正在执行任务: C/C: g.exe 生成活动文件 正在启动生成… cmd /c chcp 65001>nul && D:\Librarys\mingw64\bin\g.exe -fdiagnostics-col…

RabbitMQ常见问题持续汇总

文章目录 消息分发不公平分发限流-basic.qos主要功能使用场景示例代码 消费者默认concurrency数量prefetch和concurrency结合&#xff1f; spring.rabbitmq.template.retry.enabledtrue和spring.rabbitmq.listener.simple.retry.enabledtrue有什么区别1. spring.rabbitmq.templ…

中药大数据(二)中药方剂表设计与导入

中药大数据&#xff08;二&#xff09;中药方剂表设计与导入 最近在做一个中药大数据的单子&#xff0c;已经爬取到了中药和方剂的数据&#xff0c;现在根据爬取到的数据设计数据库和导入neo4j形成知识图谱。 1 中药方剂数据表设计 爬取到的字段有 方剂名 title 处方 presc…

自动化部署-01-jenkins安装

文章目录 前言一、下载安装二、启动三、问题3.1 jdk版本问题3.2 端口冲突3.3 系统字体配置问题 四、再次启动五、配置jenkins5.1 解锁5.2 安装插件5.3 创建管理员用户5.4 实例配置5.5 开始使用5.6 完成 总结 前言 spingcloud微服务等每次部署到服务器上&#xff0c;都需要本地…

【判断推理】逻辑论证之数量论证

3.1 比例类论证 看比例而不是单看分子&#xff01; 逻辑类似于抛开剂量谈毒性没有价值。不明确基数大小&#xff0c;单纯比较数量没有价值。 本题中&#xff0c;平民总数可能有1000万&#xff0c;军队综述可能就50万&#xff0c;死亡率不可能相似。 论点&#xff1a;家人吸…

利用Pixabay API获取免费图片和视频的完整指南

视觉内容在吸引受众和有效传达信息方面发挥着举足轻重的作用。然而&#xff0c;获取这些内容往往需要付出高昂的代价。 幸运的是&#xff0c;Pixabay 提供了 440 多万种免费资产&#xff0c;从令人惊叹的照片到引人入胜的视频&#xff0c;所有这些都可以通过其 API 访问。 在…

处理Hutool的Http工具上传大文件报OOM

程序环境 JDK版本&#xff1a; 1.8Hutool版本&#xff1a; 5.8.25 问题描述 客服端文件上传主要代码&#xff1a; HttpRequest httpRequest HttpUtil.createPost(FILE_UPLOAD_URL); Resource urlResource new UrlResource(url, fileName); httpRequest.form("file&q…

nrm之npm镜像源管理工具(NPMRegistryManager)

1. Whats is nrm? 1. 官网地址 https://github.com/Pana/nrm https://www.npmjs.com/package/nrm 2. 关于nrm nrm can help you easy and fast switch between different npm registries, now include: npm, cnpm, taobao, nj(nodejitsu). nrm可以帮助您在不同的 npm 注册表…

智能AI监测系统燃气安全改造方案的背景及应用价值

随着燃气行业的迅速发展和城市化进程的加快&#xff0c;燃气安全管理成为企业运营和城市管理中不可忽视的关键领域。燃气泄漏、管道破损等事故的发生不仅会造成严重的经济损失&#xff0c;还威胁到人民生命财产安全。传统的安全管理方法往往依赖人工巡检和手动监测&#xff0c;…

Discuz发布原创AI帖子内容生成:起尔 | AI原创帖子内容生成插件开发定制

Discuz发布原创AI帖子内容生成&#xff1a;起尔 | AI原创帖子内容生成插件开发定制 在当今互联网快速发展的时代&#xff0c;内容创作成为了网站运营、社交媒体管理和个人博客维护不可或缺的一部分。然而&#xff0c;高质量内容的创作往往耗时耗力&#xff0c;特别是对于需要频…

webpack 老项目升级记录:从 node-sass 限制的的 node v8 提升至支持 ^node v22

老项目简介 技术框架 vue 2.5.17webpack 4.16.5"webpack-cli": "3.1.0""node-sass": "^4.7.2" 几个阶段 第一步&#xff1a;vue2 升级到最新 第一步&#xff1a;升级 vue2 至最新版本&#xff0c;截止到目前&#xff08;2024-10-…

用js+css实现圆环型的进度条——js+css基础积累

如果用jscss实现圆环型的进度条&#xff1a; 直接上代码&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta http-equiv"X-UA-Compatible" content"IEedge" /><met…

通信协议——UART

目录 基础概念串行&并行串行的优缺点 单工&双工 UART基本概念时序图思考&#xff1a;接收方如何确定01和0011 基础概念 串行&并行 串行为8车道&#xff0c;并行为1车道 串行的优缺点 通行速度快浪费资源布线复杂线与线之间存在干扰 单工&双工 单工&#xf…