JS逆向和前端加密暴力破解(小白无痛学习)，黑客技术零基础入门到精通教程！

网站运行的时间轴

url–>加载html–>加载js–>运行js初始化–>用户触发某个事件–调用了某段js–>明文数据–>加密函数–>加密后的数据–>send（给服务器发信息{XHR–SEND}） -->接收到服务器数据–>解密函数–>刷新函数–>刷新网页渲染

浏览器的调试功能

调试时使用最多的功能页面是：元素（ELements）、控制台（Console）、源代码（Sources）、网络（Network）

元素（Elements）：用于查看或修改HTML元素的属性、CSS属性、监听事件、断点（DOM断点：在JavaScript调试中，我们经常使用到断点调试，其实在DOM结构的调试中，我们也可以使用断点方法，这就是DOM Breakpoint（DOM 断点））
控制台（Console）：控制台一般用于执行一次性代码，查看JavaScript对象，查看调试日志信息或异常信息。
源代码（Sources）：该页面用于查看页面的HTML文件源代码、JavaScript源代码、CSS源代码，此外最重要的是可以调试JavaScript源代码，可以给JS代码添加断点等。
网络（Network）：网络页面主要用于查看header等与网络连接相关的信息。
资源（Resources）：查看本地资源信息的（cookie,local storage,session storage等）

在这里插入图片描述

定位到具体位置,可以右键进行编辑

在这里插入图片描述

这个修改也仅对当前的页面渲染生效，不会修改服务器的源代码

右边的侧栏个功能的介绍

在这里插入图片描述

我给大家准备了一份全套的《网络安全入门+进阶学习资源包》包含各种常用工具和黑客技术电子书以及视频教程，需要的小伙伴可以扫描下方二维码或链接免费领取~

控制台

作用是

查看JS对象的及其属性
执行JS语句
查看控制台日志：当网页的JS代码中使用了console.log()函数时，该函数输出的日志信息会在控制台中显示。日志信息一般在开发调试时启用，而当正式上线后，一般会将该函数去掉。

在这里插入图片描述

小知识(tab键补全这里也是支持的),建议大家dom树学好

在这里插入图片描述

调试快捷键

F10，跳过当前方法（如果执行到一个自定义方法，不进入方法内部）
F11，进入当前方法（如果当前方法是一个自定义方法，进入方法内部）
SHIFT+F11 跳出当前方法
F8，跳到下一个断点

网络（Network）

在这里插入图片描述

Header：面板列出资源的请求url、HTTP方法、响应状态码、请求头和响应头及它们各自的值、请求参数等等
Preview：预览面板，用于资源的预览。
Response：响应信息面板包含资源还未进行格式处理的内容
Timing：资源请求的详细信息花费时间

查看Network基本信息,请求了哪些地址及每个URL的网络相关请求信息都可以看的到：URL，响应状态码，响应数据类型，响应数据大小，响应时间

在这里插入图片描述
请求URL可进行筛选和分类：选择不同分类,查看请求URL,方便查找

在这里插入图片描述

也可以直接Filter搜索查询相关URL，可以输入关键字或者正则表达式进行查询

在这里插入图片描述

那么在js文件中我们如何快速定位到加密函数

搜索关键字：登陆时的uri、passwd、Encrypt、Decrypt、…
使用一个神奇的脚本提高效率：https://github.com/Cha111Ng1/Tampermonkey_cha11/blob/main/HookScript.js

利用加解密函数

复原原加密逻辑
抠出原有js
rpc主动调用

工具推荐

phantomjs——https://phantomjs.org/download.html

PhantomJS是一个基于webkit的javaScript API。它使用QtWebKit作为它核心浏览器的功能，使用webkit来编译解释执行javaScript代码。任何你可以基于在webkit浏览器做的事情，它都能做到。它不仅是个隐性的浏览器，提供了诸如css选择器、支持wen标准、DOM操作、json、HTML5等，同时也提供了处理文件I/O的操作，从而使你可以向操作系统读写文件等。phantomJS的用处可谓非常广泛诸如网络监测、网页截屏、无需浏览器的wen测试、页面访问自动化等。

在前端渗透过程中，常会遇到需要进行爆破，但密码字段使用了自定义加密算法加密的情况。此时可以使用Burp配合jsEncrypter插件自定义加密算法进行爆破。流程图
在这里插入图片描述
项目地址：