Web开发-JS应用原生代码前端数据加密CryptoJS库jsencrypt库代码混淆

server/2025/3/28 11:14:48/

知识点:
1、安全开发-原生JS-数据加密&代码混淆
2、安全开发-原生JS-数据解密安全案例

一、演示案例-WEB开发-原生JS&第三方库-数据加密

前端技术JS实现:
1、非加密数据大致流程:
客户端发送->明文数据传输-服务端接受数据->处理数据2、加密数据大致流程:
客户端发送->明文加密->密文数据传输-服务端接受数据->解密数据->处理数据

Crypto_14">前端加密-Crypto

项目地址:https://github.com/brix/crypto-js
参考文章:https://juejin.cn/post/7382893339181613068
使用Crypto库进行MD5/SHA1/HMAC/AES/DES等加密

下载到本地调用:
<script src="crypto-js.js"></script>在线远程调用:
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>

base64编码-JS原生

在这里插入图片描述
在这里插入图片描述

MD5

在这里插入图片描述
在这里插入图片描述

SHA1

在这里插入图片描述

在这里插入图片描述

HMAC

在这里插入图片描述
在这里插入图片描述

AES

http://tool.chacuo.net/cryptaes
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

DES

http://tool.chacuo.net/cryptaes
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

jsencrypt_51">前端加密-jsencrypt

项目地址:https://github.com/travist/jsencrypt
参考文章:https://www.cnblogs.com/Lrn14616/p/10154529.html

使用jsencrypt库进行RSA等加密

下载本地调用:
<script src="jsencrypt.js"></script>在线远程调用:
<script src="https://cdn.bootcdn.net/ajax/libs/jsencrypt/3.3.2/jsencrypt.js"></script>

在这里插入图片描述
在这里插入图片描述
http://tool.chacuo.net/cryptaes
在这里插入图片描述

公钥加密,私钥解密(反之私钥加密,公钥解密)

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

安全测试–AES-DEMO

一个登录页面,密码被加密对安全测试的影响。
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
如果用户传输的密码是加密的,那么在进行爆破的时候也要对应加密传输,如果直接传明文过去,对方一接收解密就会出错,从而造成干扰。

从加密数据逆向代码分析加密逻辑
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
如果要本地调试
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

安全测试-MD5-某真实博客

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
如果要本地调试
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

安全测试-AES-某真实系统

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二、演示案例-WEB开发-在线混淆-代码混淆

混淆代码的主要目的是保护源代码,防止未经授权的复制、篡改或逆向工程。通过对变量名、字符串和控制流的修改,混淆代码看似毫无逻辑,但本质功能未变。混淆技术常用于商业应用和恶意软件中。

压缩

去除js代码中的不必要的空格、换行等内容。使源码压缩为几行内容,降低代码可读性,提高网站的加载速度。

混淆

使用变量替换、僵尸函数、字符串阵列化、控制流平坦化、调试保护等手段,使代码变得难以阅读和分析,达到最终保护的目的,不影响代码原有功能,是理想、实用的javascript保护方案。

在线混淆

在这里插入图片描述

https://obfuscator.io/ //国外的js混淆网站
在这里插入图片描述
在这里插入图片描述


http://www.ppmy.cn/server/176789.html

相关文章

2025.3.20总结

阅读&#xff1a;《时间贫穷》第二章&#xff0c;里面讲到&#xff0c;运动&#xff0c;多行善事&#xff0c;体验自然&#xff0c;都会增强自我效能感&#xff0c;是对抗时间焦虑的强有力的方式。 花时间运动是值得的&#xff0c;公司每周三都是运动周&#xff0c;把运动视作…

51单片机和STM32 入门分析

51单片机和STM32是嵌入式开发中两种主流的微控制器&#xff0c;它们在架构、性能、应用场景等方面存在显著差异。以下是两者的对比分析及选择建议&#xff1a; 1. 51单片机与STM32的定义与特点 51单片机 定义&#xff1a;基于Intel 8051内核的8位微控制器&#xff0c;结构简单…

代码随想录Day20

Day20 回溯算法part02 LeetCode 39. 组合总和 题目描述 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target &#xff0c;找出 candidates 中可以使数字和为目标数 target 的 所有 不同组合 &#xff0c;并以列表形式返回。你可以按 任意顺序 返回这些组合。…

Docker --shm-size参数含义

文章目录 解释 解释 --shm-size 是一个用于 Docker 的参数&#xff0c;用来设置容器的共享内存大小。 在 Docker 中&#xff0c;/dev/shm 是一个临时文件系统&#xff08;tmpfs&#xff09;&#xff0c;用于存储共享内存。默认情况下&#xff0c;Docker 容器的共享内存大小是…

NO.51十六届蓝桥杯备战|堆算法题|第k小|除2|最小函数值|序列合并|舞蹈课(C++)

P3378 【模板】堆 - 洛谷 #include <bits/stdc.h> using namespace std;const int N 1e6 10; int n; int heap[N];void up(int child) {int parent child / 2;while (parent > 1 && heap[child] < heap[parent]){swap(heap[child], heap[parent]);chil…

「实战指南 」Swift 并发中的任务取消机制

网罗开发 &#xff08;小红书、快手、视频号同名&#xff09; 大家好&#xff0c;我是 展菲&#xff0c;目前在上市企业从事人工智能项目研发管理工作&#xff0c;平时热衷于分享各种编程领域的软硬技能知识以及前沿技术&#xff0c;包括iOS、前端、Harmony OS、Java、Python等…

vue中根据html动态渲染内容

需求&#xff1a;根据数据中的html&#xff0c;因为我是在做填空&#xff0c;所以是需要将html中的_____替换成input&#xff0c;由于具体需求我使用的是元素contenteditable代替的可编辑的input html部分 <div class"wrap"><component :is"rendered…

Springboot项目搭建(9)-分页与文件上传

1.添加依赖 在pom.xml中添加分页依赖 <dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper-spring-boot-starter</artifactId><version>1.4.6</version> </dependency> 2.Entity层 定义实体类&a…