关于前端加密的那些事CryptoJS(值得收藏)

文章目录

介绍:

CryptoJS 是一个在 JavaScript 中实现了加密算法的开源库。它支持多种的算法:MD5、SHA-1、SHA-2、SHA-3、RIPEMD-160 哈希散列,进行 AES、DES、Rabbit、RC4、 RC4Drop、Triple DES 加解密。
在线加密解密工具

一、功能特点

1、多种加密算法

支持常见的加密算法,如 AES(高级加密标准)、DES(数据加密标准)、RC4 等对称加密算法。这些算法可用于对数据进行加密和解密,确保数据的保密性。

也提供了哈希算法,如 MD5、SHA-1、SHA-256 等,用于生成数据的唯一摘要,可用于数据完整性校验和密码存储等场景。

2、编码与解码

可以进行 Base64 编码和解码,方便在不同系统之间传输二进制数据。

支持十六进制编码和解码,对于处理字节流数据非常有用。

3、易于使用

提供了简洁的 API,使得在 JavaScript 中进行加密和解密操作变得非常简单。你只需要引入 CryptoJS 库,就可以使用其提供的函数进行各种加密操作。

二、使用场景

1、前端数据安全

在 Web 应用中,如果你需要在客户端对敏感数据进行加密,然后将加密后的数据发送到服务器,可以使用 CryptoJS 来实现。例如,对用户的密码进行加密后再传输,以防止密码在网络传输过程中被窃取。

对于一些需要在本地存储的敏感信息,也可以使用 CryptoJS 进行加密,以提高数据的安全性。

2、后端与前端交互

在前后端分离的应用中,后端也可以使用与前端相同的加密算法库,确保数据在传输过程中的安全性。例如,后端可以使用 CryptoJS 对从前端接收到的数据进行解密,或者对要返回给前端的数据进行加密。

3、密码存储与验证

当用户注册或登录时,可以使用哈希算法对用户密码进行处理,并将哈希值存储在数据库中。在用户登录时,再次对用户输入的密码进行哈希处理,并与数据库中的哈希值进行比较,以验证用户的身份。

三、代码示例

javascript 复制代码
// 引入 CryptoJS 库
const CryptoJS = require('crypto-js');

//或者npm引入
// npm install crypto-js

// 要加密的数据
const data = 'Hello, World!';

// 加密密钥
const key = CryptoJS.enc.Utf8.parse('mysecretkey12345');

// 使用 AES 加密 AES是常见的对称加密算法,加密和解密使用相同的密钥

export function encrypt(data,key){
 if (!data||!key) return ''
 const encryptedData = CryptoJS.AES.encrypt(data, key, {
  mode: CryptoJS.mode.ECB,
  padding: CryptoJS.pad.Pkcs7
});
// 输出加密后的数据
return encryptedData.toString()
}



// 解密
export function decrypt(data,key){
const decryptedData = CryptoJS.AES.decrypt(data, key, {
  mode: CryptoJS.mode.ECB,
  padding: CryptoJS.pad.Pkcs7
});

// 输出解密后的数据
return decryptedData.toString(CryptoJS.enc.Utf8)
}

四、参数结构

CryptoJS.AES.encryp(message,key,{mode:CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7,iv:WordArray}) iv:WordArray可选参数

五、主要属性说明:

一、参数说明
message

类型:可以是字符串、WordArray(CryptoJS 中的一种数据类型,用于表示二进制数据的数组)或其他可转换为二进制数据的类型。

说明:这是要加密的原始数据。
key

类型:通常是一个 WordArray 或可以转换为 WordArray 的数据,如字符串。

说明:加密密钥,AES 加密需要一个特定长度的密钥,通常为 128 位、192 位或 256 位。密钥的长度决定了加密的强度。
options(可选):
mode

类型:一个表示加密模式的常量,如 CryptoJS.mode.ECB(电子密码本模式)、CryptoJS.mode.CBC(密码分组链接模式)等。

说明:加密模式决定了如何将数据分块进行加密以及如何处理块之间的关系。不同的模式有不同的特点和安全性考虑。
padding

类型:一个表示填充方式的常量,如 CryptoJS.pad.Pkcs7(PKCS#7 填充)、CryptoJS.pad.ZeroPadding(零填充)等。

说明:由于 AES 通常要求数据长度是固定块大小的整数倍,所以需要对不足块大小的数据进行填充。填充方式决定了如何在数据末尾添加额外的字节以满足块大小要求。
iv(仅在某些模式下需要):

类型:一个 WordArray,表示初始向量。

说明:在某些加密模式(如 CBC 模式)中,需要一个初始向量来增加加密的随机性和安全性。初始向量应该是随机生成的,并且在每次加密过程中都应该不同。

相关推荐
fouryears_234175 分钟前
现代 Android 后台应用读取剪贴板最佳实践
android·前端·flutter·dart
boolean的主人9 分钟前
mac电脑安装nvm
前端
用户19729591889112 分钟前
WKWebView的重定向(objective_c)
前端·ios
烟袅17 分钟前
5 分钟把 Coze 智能体嵌入网页:原生 JS + Vite 极简方案
前端·javascript·llm
18你磊哥18 分钟前
Django WEB 简单项目创建与结构讲解
前端·python·django·sqlite
KangJX19 分钟前
iOS 语音房(拍卖房)开发实践
前端·前端框架·客户端
神秘的猪头39 分钟前
🧠 深入理解 JavaScript Promise 与 `Promise.all`:从原型链到异步编程实战
前端·javascript·面试
白兰地空瓶41 分钟前
从「似懂非懂」到「了如指掌」:Promise 与原型链全维度拆解
前端·javascript
麦麦在写代码42 分钟前
前端学习5
前端·学习
YF02111 小时前
Frida for MacBook/Android 安装配置
android·前端