使用 crypto-js 进行 AES 加解密操作

在前端开发中,数据的加密和解密是为了保障用户隐私和数据的安全性而常见的任务。AES(Advanced Encryption Standard)是一种对称密钥加密算法,被广泛用于保护敏感信息的传输和存储。本文将介绍 AES 加解密的基本原理,并结合 Crypto-JS 库提供的实例代码进行说明。

crypto-js AES

一、AES 简介

AES 是一种块加密算法,它以固定大小的块(128位)处理数据,并支持不同密钥长度(128、192、256位)。由于其高度的安全性和效率,AES 已成为许多安全应用的首选算法。

加密过程

  1. 初始轮(Initial Round): 将明文与第一轮密钥进行异或运算。
  2. 多轮加密(Rounds): 将初始轮的结果经过多轮的重复处理。每一轮都包括四个步骤:SubBytes、ShiftRows、MixColumns、AddRoundKey。
  3. 最终轮(Final Round): 在最后一轮中,省略 MixColumns 步骤,只进行 SubBytes、ShiftRows 和 AddRoundKey。

解密过程

解密过程与加密过程相似,但是顺序相反,且在每一轮中使用的密钥是加密时的逆操作。最终得到解密后的明文。

二、Crypto-JS 介绍

Crypto-JS 是一个开源的 JavaScript 加密库,它提供了常见的加解密算法,包括 AESDESRabbitRC4MD5PBKDF2HMACSHA1SHA256SHA3RabbitRabbit-OAEPECIES 等。本文将使用 Crypto-JS 提供的 AES 算法进行加解密操作。

三、Crypto-JS AES 加解密操作

1. 引入Crypto-JS库

首先,确保你的项目中已经引入了 crypto-js 库。在本例中,我们使用了AES加解密算法,因此需要引入相应的模块:

import AES from 'crypto-js/aes'
import enc from 'crypto-js/enc-utf8'
import ECB from 'crypto-js/mode-ecb'
import Pkcs7 from 'crypto-js/pad-pkcs7'
// import MD5 from 'crypto-js/md5'

2. 设置密钥和常量

在加解密过程中,密钥 是一个关键的参数。我们需要定义密钥,以便后续的加解密操作。

import { SecretKey } from '@/common/consts.js'
const SecretKey = 'your secret key'
// 获取密钥对应的byte数组
const keyBytes = enc.parse(SecretKey)

3. 解密操作

下面是解密操作的代码示例,其中包括了设置加解密模式和填充方式:

export function decode(str = '') {
  try {
    const decryptedBytes = AES.decrypt(str, keyBytes, {
      mode: ECB, // 加解密模式
      padding: Pkcs7, // 填充方式
    })
    return decryptedBytes.toString(enc)
  } catch (err) {
    console.log(err)
    return ''
  }
}

4. 加密操作

同样,以下是加密操作的代码示例,也包括了设置加解密模式和填充方式:

export function encode(str = '') {
  try {
    const encryptedBytes = AES.encrypt(str, keyBytes, {
      mode: ECB, // 加解密模式
      padding: Pkcs7, // 填充方式
    })
    return encryptedBytes.toString()
  } catch (err) {
    console.log(err)
    return ''
  }
}

通过以上步骤,我们就完成了使用 Crypto-JS 进行 AES 加解密操作的实例。这些代码可以轻松地集成到你的前端项目中,以保障敏感信息的安全传输和存储。希望这个实例能够帮助你更好地理解前端加密操作的过程。

参考文档:

  • Crypto-JS 官方文档
  • Crypto-JS npm

欢迎访问:天问博客

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

超过GPT3.5?Mixtral 8*7B 模型结构分析

Datawhale干货 作者:宋志学,Datawhale成员 前言 2023年12月11日,Mistral AI团队发布了一款高质量的稀疏专家混合模型Mixtral 8x7B。 Mistral AI继续致力于向开发者社区提供最优秀的开放模型。在人工智能领域向前发展,需要采取超越…

Node.js 使用 cors 中间件解决跨域问题

CORS 跨域资源共享 什么是 CORS cors 是 Express 的一个第三方中间件。通过安装和配置 cors 中间件,可以很方便地解决跨域问题。 CORS (Cross-Origin Resource Sharing,跨域资源共享)由一系列 HTTP 响应头组成,这些…

统计学-R语言-4.6

文章目录 前言列联表条形图及其变种---单式条形图条形图及其变种---帕累托图条形图及其变种---复式条形图条形图及其变种---脊形图条形图及其变种---马赛克图饼图及其变种---饼图饼图及其变种---扇形图直方图茎叶图箱线图小提琴图气泡图总结 前言 本篇文章是对数据可视化的补充…

Vulnhub-TECH_SUPP0RT: 1渗透

文章目录 一、前言1、靶机ip配置2、渗透目标3、渗透概括 开始实战一、信息获取二、使用smb服务获取信息三、密码破解四、获取webshell五、反弹shell六、web配置文件获取信息七、提权 一、前言 由于在做靶机的时候,涉及到的渗透思路是非常的广泛,所以在写…

手把手教你如何快速定位bug,如何编写测试用例,快来观摩......

手把手教你如何快速定位bug,如何编写测试用例,快来观摩......手把手教你如何快速定位bug,如何编写测试用例,快来观摩......作为一名测试人员如果连常见的系统问题都不知道如何分析,频繁将前端人员问题指派给后端人员,后端人员问题指派给前端人员&#xf…

Rust - 可变引用和悬垂引用

可变引用 在上一篇文章中,我们提到了借用的概念,将获取引用作为函数参数称为 借用(borrowing),通常情况下,我们无法修改借来的变量,但是可以通过可变引用实现修改借来的变量。代码示例如下&…

超详细的 pytest 钩子函数 —— 之初始钩子和引导钩子来啦!

前几篇文章介绍了 pytest 点的基本使用,学完前面几篇的内容基本上就可以满足工作中编写用例和进行自动化测试的需求。从这篇文章开始会陆续给大家介绍 pytest 中的钩子函数,插件开发等等。 仔细去看过 pytest 文档的小伙伴,应该都有发现 pyt…

爬虫接口获取外汇数据(汇率,外汇储备,贸易顺差,美国CPI,M2,国债利率)

akshare是一个很好用的财经数据api接口,完全免费!!和Tushare不一样。 除了我标题显示的数据外,他还提供各种股票数据,债券数据,外汇,期货,宏观经济,基金,银行…

木塑地板行业分析:市场正展现出自身良好的发展势头

木塑地板是一种新型环保型木塑复合材料产品,在生产中、高密度纤维板过程中所产生的木酚,加入再生塑料经过造粒设备做成木塑复合材料,然后进行挤出生产组做成木塑地板。 木塑地板能够跃居行业主流,得到众企业和消费者的追捧&#x…

STM32 GD32 瑞萨 psoc 等单片机 无线wifi蓝牙最佳解决方案

新联鑫威一系列低功耗高性价比sdio wifi/蓝牙combo的模块CYWL6208 , CYWL6312, CYW6209等可以搭配stm32 各种型号例如以下,支持sta/ap/apsta,双模蓝牙的应用,支持rt-thread, freertos, Azure RTOS, Linux, Android系统. 稳定强,功耗低&#x…

C# .NET读取Excel文件并将数据导出到DataTable、数据库及文本

Excel文件是存储表格数据的普遍格式,因此能够高效地读取和提取信息对于我们来说至关重要。C#语言借助.NET Framework和各种库的广泛功能,能够进行高效的数据操作。利用C#读取Excel文件并将数据写入数据库和DataTable,或者将数据用于其他目的&…

力扣-202. 快乐数解析-弗洛伊德循环查找算法

题目链接 public static void Happy(int n) {int sum 0;int digit 0;for (int i 0; i < 20; i) {while (n ! 0) {digit n%10;sum digit*digit;n/10;}System.out.print(sum " ");n sum;sum 0;}} 使用代码测试一下每一代数字 n 2 : 4 16 37 58 89 145 42 …

erlang (OS 操作模块)学习笔记

cmd: env: 返回所有环境变量的列表。 每个环境变量都表示为元组 {VarName&#xff0c;Value}&#xff0c;其中 VarName 是 变量和 Value 其值。 例: {VarName&#xff0c;Value} {"ERLANG_HOME","C:\\Program Files\\erl-24.3.4.2\\bin\\erl-24.3.4.2"}…

什么是OSPF?为什么需要OSPF?OSPF基础概念

什么是OSPF&#xff1f; 开放式最短路径优先OSPF&#xff08;Open Shortest Path First&#xff09;是IETF组织开发的一个基于链路状态的内部网关协议&#xff08;Interior Gateway Protocol&#xff09;。 目前针对IPv4协议使用的是OSPF Version 2&#xff08;RFC2328&#x…

mac 中vscode设置root启动

1. 找到你的vscode app&#xff0c;点击鼠标右键------->选项----->在访达中显示 2. 终端中输入以下命令&#xff0c;不要点回车&#xff0c;不要点回车&#xff0c;输入一个空格 sudo chflags uchg 3. 然后将你的程序拖到终端&#xff0c;会自动…

“modem帮”知识星球介绍

大家好&#xff0c;这是一篇介绍知识星球的文章。在这个账户分享协议知识已经快2年了&#xff0c;目前主要内容是5G L1/L2/L3 spec知识分享。渐渐地越来越多的小伙伴会留言或者私信我问题&#xff0c;收到问题我都有做了详细回答&#xff0c;给出回答后&#xff0c;有些没有收到…

靶机来源-basic_pentesting_1【VX订阅号:0x00实验室】

basic_pentesting_1【VX订阅号&#xff1a;0x00实验室】 arp-scan扫描靶机IP masscan 192.168.253.153 --ports 0-65535 --rate10000端口扫描 nmap扫描nmap -T5 -A -p- 192.168.253.153 21&#xff1a;ProFTPD 1.3.3 dirb http://192.168.253.153 目录扫描 http://192.16…

PXE高效批量网络装机及kickstart无人值守安装

通过网卡启动 将准备的好的 4大文件 下载本地内存 &#xff0c;然后利用kikstart 应答文件 完成一键装机 单机&#xff1a; 光驱加载 linux 镜像去安装操作系统&#xff0c;光驱里有一个小型的linux操作系统 将操作系统 安装进自己的硬盘 PE 操作系统是外来的 设备的上操作系…

某马头条——day06

自媒体文章上下架 使用消息队列在自媒体下架时通知文章微服务。 kafka概述 kafka环境搭建 docker pull zookeeper:3.4.14 docker run -d --name zookeeper -p 2181:2181 zookeeper:3.4.14 安装kafka docker pull wurstmeister/kafka:2.12-2.3.1 docker run -d --name kafka…

Leetcode518. 零钱兑换 II

Every day a Leetcode 题目来源&#xff1a;518. 零钱兑换 II 解法1&#xff1a;动态规划 dp[i]: 总金额为 i 的硬币组合数。 初始化&#xff1a; dp[0] 1。 边界&#xff1a;dp[0]1。只有当不选取任何硬币时&#xff0c;金额之和才为 0&#xff0c;因此只有 1 种硬币组…