vue 项目中添加DES加密
vue 项目中添加DES加密
由于现在项目使用http协议,且登录界面是明文传输,项目真正上线后基本的密码传输都很不安全。
决定用前端框架加密后再进行传输,以提高密码传输过程中的安全性。
crypto-js 是一个流行的 JavaScript 加密库,它提供了多种加密算法和功能。以下是一些 crypto-js 提供的常见加密方法:
常见的加密方法(简单看一下有点印象,下边着重介绍des加密)
1.AES (Advanced Encryption Standard): 对称加密算法,支持多种模式(如 CBC, CTR, GCM 等)和填充方案。
CryptoJS.AES.encrypt(message, password, [options])
CryptoJS.AES.decrypt(ciphertext, password, [options])
2.DES (Data Encryption Standard): 对称加密算法,较老的标准。
CryptoJS.DES.encrypt(message, password, [options])
CryptoJS.DES.decrypt(ciphertext, password, [options])
3.Triple DES (3DES or DES-EDE3): 是 DES 的一个增强版本,使用三个不同的密钥。
CryptoJS.TripleDES.encrypt(message, password, [options])
CryptoJS.TripleDES.decrypt(ciphertext, password, [options])
4.Rabbit: 一个流密码,适用于加密大量数据。
CryptoJS.Rabbit.encrypt(message, password, [options])
CryptoJS.Rabbit.decrypt(ciphertext, password, [options])
5.RC4: 一个流密码,速度很快,但存在一些已知的弱点。
CryptoJS.RC4.encrypt(message, password, [options])
CryptoJS.RC4.decrypt(ciphertext, password, [options])
6.SHA1, SHA256, SHA512: 散列函数,用于生成数据的哈希值。
CryptoJS.SHA1(message)
CryptoJS.SHA256(message)
CryptoJS.SHA512(message)
7.HMAC (Hash-based Message Authentication Code): 基于散列函数的消息认证码,用于验证消息的完整性和来源。
CryptoJS.HmacSHA1(message, key)
CryptoJS.HmacSHA256(message, key)
CryptoJS.HmacSHA512(message, key)
8.PBKDF2 (Password-Based Key Derivation Function 2): 从密码中派生密钥的函数。
CryptoJS.PBKDF2(password, salt, iterations, keySize, hasher)
9.PRNG (Pseudo-Random Number Generator): 生成伪随机数。
CryptoJS.lib.WordArray.random(nBytes)
10.Base64: 编码和解码方法,用于将二进制数据转换为可打印的 ASCII 字符串。
CryptoJS.enc.Base64.stringify(wordArray)
CryptoJS.enc.Base64.parse(base64String)
这只是 crypto-js 提供的功能的一部分。为了获得完整的列表和详细的使用方法,建议查阅 crypto-js 的官方文档或源代码。
这里详细介绍一种加密方式des加密,其他加密类似操作
1.安装插件
安装
npm install crypto-js//引入
import CryptoJS from 'crypto-js';
或者下载依赖中crypto-js.js复制到本地,在引入到使用的文件中
var CryptoJS = require('./crypto-js.js')
2.封装加解密方法
var CryptoJS = require('./crypto-js.js')const key = '' //秘钥
const keyHex = CryptoJS.enc.Utf8.parse(key)// 加密
const encryptDES = (message) => {if (message) {var encrypt = CryptoJS.DES.encrypt(message, keyHex, {// 配置选项mode: CryptoJS.mode.ECB, // 加密模式,ECB 是最简单的模式,但通常不推荐用于安全应用padding: CryptoJS.pad.Pkcs7 // 填充方案,用于确保数据长度适合加密})// return encrypt.toString(); //输出的是base64格式密文return encrypt.ciphertext.toString() // 加密出来为 hex格式密文// 注意点: 前后端加密的mode,padding和输出值需要保持一致,上边我写了两种格式的输出对应好应该就没啥问题了.} else {return ''}
}// 解密
const decryptDES = (ciphertext) => {if (ciphertext) {const decrypted = CryptoJS.DES.decrypt({ciphertext: CryptoJS.enc.Hex.parse(ciphertext)}, keyHex, {mode: CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7})return decrypted.toString(CryptoJS.enc.Utf8)} else {return ''}
}export {encryptDES,decryptDES
}
在上面的配置中:
message 是要加密的明文消息。
keyHex 是用于加密和解密的密钥。
对于 DES,它应该是 8 字节长(64 位)。在真实场景中,密钥通常通过更安全的机制生成和存储。
mode 是加密模式,
这里使用的是 CryptoJS.mode.ECB(电子密码本模式)。尽管 ECB 模式简单,但它通常被认为是不安全的,因为它不提供任何形式的块链接。更安全的模式包括 CBC(密码块链接模式)和 CFB(密码反馈模式)等。
padding 是填充方案,
用于确保数据长度适合加密。CryptoJS.pad.Pkcs7 是一种常用的填充方法。
请注意,DES 加密由于其较短的密钥长度(56 位)和已知的弱点,现在被认为是不安全的,并且在许多现代应用中都已被更安全的加密算法(如 AES)所取代。如果你正在开发一个新的应用或系统,建议使用更现代、更安全的加密算法。
3.使用
使用很简单引入后直接调用就可以
import { encryptDES,decryptDES } from '@/utils/jiami/cryptoDes'
const ciphertext= encryptDES(message) //加密
const message= decryptDES(ciphertext) //解密
相关文章:
vue 项目中添加DES加密
vue 项目中添加DES加密 由于现在项目使用http协议,且登录界面是明文传输,项目真正上线后基本的密码传输都很不安全。 决定用前端框架加密后再进行传输,以提高密码传输过程中的安全性。 crypto-js 是一个流行的 JavaScript 加密库࿰…...
【记录问题】如何测试虚拟机已经可以连接网络
如何测试虚拟机已经可以连接网络 要测试虚拟机是否已经连接网络,可以采取以下步骤: 检查虚拟网络编辑器 使用管理员权限打开虚拟网络编辑器,检查NAT方式下的虚拟子网网段。 确保虚拟机的网络设置与虚拟子网网段相匹配。检查虚拟机网络设置 …...
MySQL数据库的详解(1)
DDL(数据库操作) 查询 查询所有数据库:show databases;当前数据库:select database(); 创建 创建数据库:create database [ if not exists] 数据库名 ; 使用 使用数据库:use 数据库名 ; 删除 删除数…...
Python 网络爬虫技巧分享:优化 Selenium 滚动加载网易新闻策略
简介 网络爬虫在数据采集和信息获取方面发挥着重要作用,而滚动加载则是许多网站常用的页面加载方式之一。针对网易新闻这样采用滚动加载的网站,如何优化爬虫策略以提高效率和准确性是一个关键问题。本文将分享如何利用 Python 中的 Selenium 库优化滚动…...
Apache SeaTunnel 社区 3 月月报
各位热爱 SeaTunnel 的小伙伴们,SeaTunnel 社区 3 月月报来啦!这里将记录 SeaTunnel 社区每个月的重要更新,并评选出月度之星,欢迎关注。 SeaTunnel 月度 Merge Stars 感谢以下小伙伴 3 月为 Apache SeaTunnel 做的精彩贡献&…...
ElasticSearch 的 ConstantScoreQuery 的理解
ConstantScoreQuery的定义: A query that wraps another query and simply returns a constant score equal to 1 for every document that matches the query. It therefore simply strips of all scores and always returns 1. 结合DisMaxQueryBuilder可以查找所…...
【RV1106的ISP使用记录之一】基础环境搭建
公司缺少ISP工程师,做为图像算法工程师的我这就不就给顶上来了么,也没给发两份工资,唉~ 先写个标题,占一个新坑,记录RK平台的传统ISP工作。 一、基础环境的硬件包括三部分: 1、相机环境,用于采…...
mars3d.MaterialType.Image2修改配置面状:图片2的speed数值实现动画效果说明
摘要: mars3d.MaterialType.Image2修改配置面状:图片2的speed数值实现动画效果说明 前提: 1.在示例中,尝试给mars3d.MaterialType.Image2材质的图片加上speed参数,实现动画效果,但是没有看到流动效果说明…...
Elasticsearch部署安装
环境准备 Anolis OS 8 Firewall关闭状态,端口自行处理 Elasticsearch:7.16.1(该版本需要jdk11) JDK:11.0.19 JDK # 解压 tar -zxvf jdk-11.0.19_linux-x64_bin.tar.gz# 编辑/etc/profile vim /etc/profile# 加入如下…...
Android零基础入门(一)配置环境和安装Android Studio
闲来无事学一下Android,本人目前java为主,jdk的环境就不赘述了 配置环境 Java JDK5 或 以后版本 Android SDK Java运行时环境(JRE) Android Studio 你可以从 Oracle 的 Java 网站:JDKJava SE下载下载最新版本的 Jav…...
Golang编译优化——消除Copy指令
一、优化概述 以下是Go编译器对某个代码段编译生成的SSA IR摘选,对于Golang SSA IR的介绍我写了文章,但是在犹豫要不要发。 b1:-... Plain → b2 (5)b2: ← b1 b4-v9 (5) Phi <int> v8 v16 (i[int])v22 (8) Phi <int> v7 v14 (r[int])v1…...
Java IO流对象流实操
ATM的io对象流: package com.jsu.atm; import com.jsu.atm.Serializable; public class Account implements Serializable{//私有数据成员private String UserName; // 用户名称private String PassWord; // 用户密码private double RemainMoney; // 用户余额…...
Mapbox教程:一个简单Demo
近期工作中准备把Mapbox用起来,准备发几个教程,把Mapbox再熟悉熟悉。工作中也用过不少的Web GIS组件,在这里说一下我对这些WebGIS组件的印象。 Leaflet 代码简洁,插件丰富,相比于其大小,功能也挺强大&#…...
看AI赋能数智化 | Gooxi AI服务器闪耀CITE 2024
4月9日“中国电子信息博览会暨2024 AI算力产业大会”在深圳如期开展,Gooxi携最新产品、行业应用全栈解决方案出席盛会,全面展示Gooxi回应数智新时代下机遇与挑战的丰富AI创新实践成果。 All in AI,奔赴新质生产力 作为中国领先的服务器解决…...
大话设计模式——21.中介者模式(Mediator Pattern)
简介 用一个中介对象来封装一系列的对象交互。中介者使各对象不需要显式地相互引用,从而使其耦合松散,而且可以独立地改变它们之间的交互 UML图 应用场景 大量的连接使得一个对象不可能在没有其他对象的支持下工作,系统表现为一个不可分割的…...
Linux 计算机网络
目录 一、网络协议 1、 "协议" 是一种约定 2、协议分层 二、网络模型 1、OSI七层模型 2、TCP/IP五层(或四层)模型 三、网络传输基本流程 四、数据包封装和分用 五、网络中的地址管理 六、网络编程套接字 1、理解源IP地址和目的IP地址 2、端口号 理解 &q…...
bash脚本中‘-b -u -p’‘$# -eq’‘#!/bin/bash’‘sed -i “s/\r//“ $1’的用法说明
#!/bin/bash#!/bin/bash: 这是 Bash 脚本的开头,指定了要使用的解释器,即 Bash。 if [ $# -eq 0 ]; thenif [ $# -eq 0 ]; then: 检查脚本是否被调用时提供了参数。$# 表示参数的数量,-eq 0 表示等于 0,即无参数。 echo "p…...
【人工智能】Gitee AI 天数智芯有奖体验开源AI模型,一定能有所收货,快来体验吧
大家好,我是全栈小5,欢迎阅读小5的系列文章。 这是《人工智能》系列文章,每篇文章将以博主理解的角度展开讲解。 目录 前言两大赛道天数智芯1.模型地址2.天数智芯专区3.选择模型4.模型详情页5.部署模型6.成功部署7.执行例子8.移除模型 千模盲…...
Ceph学习 -8.认证管理-用户基础
文章目录 1.用户基础1.1 基础知识1.2 简单实践1.3 小结 1.用户基础 学习目标:这一节,我们从基础知识、简单实践、小结三个方面来学习。 1.1 基础知识 简介 Ceph集群管理员能够直接在Ceph集群中创建、更新和删除用户 注意:创建用户时&#x…...
大创项目推荐 深度学习+opencv+python实现昆虫识别 -图像识别 昆虫识别
文章目录 0 前言1 课题背景2 具体实现3 数据收集和处理3 卷积神经网络2.1卷积层2.2 池化层2.3 激活函数:2.4 全连接层2.5 使用tensorflow中keras模块实现卷积神经网络 4 MobileNetV2网络5 损失函数softmax 交叉熵5.1 softmax函数5.2 交叉熵损失函数 6 优化器SGD7 学…...
一站式Steam Deck控制器配置方案:Windows平台完整游戏体验指南
一站式Steam Deck控制器配置方案:Windows平台完整游戏体验指南 【免费下载链接】steam-deck-windows-usermode-driver A windows usermode controller driver for the steam deck internal controller. 项目地址: https://gitcode.com/gh_mirrors/st/steam-deck-w…...
Python开发者三步完成Taotoken OpenAI兼容接口的接入与调用
🚀 告别海外账号与网络限制!稳定直连全球优质大模型,限时半价接入中。 👉 点击领取海量免费额度 Python开发者三步完成Taotoken OpenAI兼容接口的接入与调用 对于习惯使用OpenAI官方Python SDK的开发者来说,接入Taoto…...
别再死记硬背了!用Python模拟LDPC和Polar码的编码过程(附代码)
Python实战:用可视化方法理解LDPC与Polar码的核心原理 在无线通信系统的物理层设计中,信道编码技术如同数据的"防弹衣",保护信息在充满噪声的传输环境中安全抵达。本文将带你用Python构建两种5G核心编码方案——LDPC码和Polar码的简…...
从2018到2023:Unity WebGL内存管理变迁史与你的2G内存墙突破指南
Unity WebGL内存管理演进与2G内存墙突破实战 引言 2018年的某个深夜,当我第一次在Chrome控制台看到"Out of Memory"的红色警告时,完全没意识到这会成为接下来五年与Unity WebGL缠斗的开端。那个使用Unity 2017.3构建的医疗可视化项目ÿ…...
如何掌握Node.js模块系统:Node.js-Design-Patterns-Third-Edition深度解析
如何掌握Node.js模块系统:Node.js-Design-Patterns-Third-Edition深度解析 【免费下载链接】Node.js-Design-Patterns-Third-Edition Node.js Design Patterns Third Edition, published by Packt 项目地址: https://gitcode.com/gh_mirrors/no/Node.js-Design-Pa…...
产品质量总是不稳?问题可能出在这五个地方
你厂里是不是也有这类难题?投入不少钱买设备、招人手,产品质量却始终上不去。不良品率高、批量出问题、客户投诉退货,甚至找不到问题根源。今天我就来聊聊质量上不去的几个原因,大家可对照自查。一、问题可能出现在生产之前看到质…...
【Langchain】 ChatPromptTemplate:从“手动拼字符串“到“专业模板“的进化之路
零基础看懂 ChatPromptTemplate:从"手动拼字符串"到"专业模板"的进化之路一句话总结:ChatPromptTemplate 是 LangChain 中专门用来组装聊天消息的"模板引擎",它能让你像填空题一样,把变量插进预设的…...
全志V853双核开发实战:RISC-V E907小核启动与Linux-RTOS通信详解
1. 项目概述:在V853-PRO上启动RISC-V E907小核最近在折腾100ASK_V853-PRO这块开发板,它搭载的全志V853芯片有个挺有意思的特性:集成了Arm Cortex-A7大核和RISC-V E907小核的双CPU架构。这颗玄铁E907小核,本质上是一个完全可综合的…...
豪门贵公子具象化!庞钦宇现身TOD‘S家宴,举手投足间尽显骑士优雅
如果说马术是勇敢者的游戏,那么庞钦宇便是这场游戏中走出的优雅绅士。近日00后马术新星庞钦宇在TODS春日家宴上完成了一次惊艳的“跨界”。在这场汇聚名流与星光的盛事中,他褪去赛场的戎装,却未减半分骑士的矜贵。举手投足间这位年轻的骑手不…...
AI代理氛围感设计:从功能实现到人性化交互的技术实践
1. 项目概述:当AI代理遇上“氛围感”最近在AI应用开发圈里,一个名为“Agent Vibes”的项目引起了我的注意。这名字起得挺有意思,直译过来是“代理氛围”,听起来不像个严肃的技术项目,反倒像在描述一种状态或感觉。但恰…...
