关于安全:前端代码安全与混淆

作者：京东批发 周亮堂

一、友商网页剖析

1.1 亚马逊

亚马逊商详地址：
https://www.amazon.com/OtterBox-Commuter-Case-iPhone-Packaging

• 所有交互事件在页面初始化时，不进行下发，期待通过 js 申请后下发 具体点击事件 js 内容
• 采纳自执行形式，避免代码格式化。【无奈调用 Chrome 自带的代码格式化工具】
• 采纳自研式框架，非传统 react / vue / angular。大量通过 data-xx 标签进行数据传递，导致标签构造较为简单。

1.2 淘宝

次要配合接口进行加密，采纳多字段烦扰，模板化加载。下发大量的模版数据，之后通过客户端进行填充。

客户端代码为传统的一般加密模式

1.3 拼多多

• 传统一般加密形式，应用 React 框架。【有显著的 React 语法糖】
• 要害的商详数据，须要强制进行登录操作，能够对账号进行封禁。

二、攻击者角度

1. [Web 逆向]数某风控 JS 算法剖析 惯例网页加密调式
2. Crack App| 某 H5 App 反调试反抗 反调式 APP 内 Webview
3. Puppeteer融入调试流程，调试体验爽翻了！可模仿用户理论点击流程，进行流程化操作，此类形式，比拟难以辨别
4. Node.js 平安最佳实际 常见的 Node JS 官网公布的被攻打类型。

• 参考：NodeJS 官网领导手册

1. 通过几行 JS 就能够读取电脑上的所有数据？旁路攻打，通过内存响应速度获取用户明码信息
2. Qwik JS框架将 JS 代码的拆分从常见的「编译时」（比方 webpack 分块）、「运行时」（比方 dynamic import），变为「交互时」。只有用户操作时，才会进行注入加载。
3. 实际：天猫汽车商详页的 SSR 革新实际 天猫汽车商详页，革新原理实质上是基于 Qwik JS。
4. 聊聊前端平安之 CSRF

• 非代码透露类，惯例类型 Web 攻打，基于代码破解后
• XSS 攻打：跨站脚本攻打(Cross-Site Scripting)，攻打指标是为了盗取存储在客户端的 cookie 或者其余网站用于辨认客户端身份的敏感信息。一旦获取到非法用户的信息后，攻击者甚至能够混充非法用户与网站进行交互。
• CSRF（Cross-site request forgery）跨站申请伪造：攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻打网站发送跨站申请。利用受害者在被攻打网站曾经获取的注册凭证，绕过后盾的用户验证，达到假冒用户对被攻打的网站执行某项操作的目标。
• 网络劫持攻打，次要是通过一些代理服务器，或者 wifi 等有中间件的网络申请，进行劫持，不法分子通过这种形式获取到用户的信息。
• 控制台注入代码，不法分子通过各种提醒诱骗用户在控制台做一些操作，从而获取用户信息。
• 钓鱼攻打，
• 电子邮件钓鱼：群发邮件，坑骗用户点击歹意的链接或附件，获取有价值的信息
• 网站钓鱼：在网站上伪造一个网站，通常是模拟非法的某个网站。为了坑骗用户点击这个网站还会采取些辅助技术，比方钓鱼邮件、短信、电话
• 防钓鱼
• SPF 记录，SPF 是为了防备垃圾邮件而提出来的一种 DNS 记录类型，它是一种 TXT 类型的记录，它用于注销某个域名领有的用来外发邮件的所有 IP 地址。
• SafeBrowsing API，谷歌的一个随时能够通过互联网拜访的 API, 容许容许浏览器在渲染之前检测 URL 的正确性。
• DDOS：分布式拒绝服务攻打（Distributed Denial of Service），简略说就是发送大量申请是使服务器瘫痪
• SQL 注入攻打，通过对 web 连贯的数据库发送歹意的 SQL 语句而产生的攻打，从而产生安全隐患和对网站的威逼，能够造成逃过验证或者私密信息泄露等危害
• 点击劫持，点击劫持是指在一个 Web 页面中暗藏了一个通明的 iframe，用外层假页面诱导用户点击，实际上是在暗藏的 frame 上触发了点击事件进行一些用户不知情的操作。

1. AI 染指解释代码，减速代码反编译过程

• 比方将友商代码放入 chatgpt 进行释义

这个只是局部代码，如果将残缺代码，一段一段进行剖析，你就能够失去残缺上下文，不须要靠人去一段一段读取代码。

目前还有 ai 代码调试如：
https://github.com/shobrook/adrenaline

三、防御者角度

1. JS 代码混同

• 应答：一般开发者或者不懂编程的普通用户。实例：大部分网页
• 进行代码混同 / 加密，缩小语义化了解。
• 通过代码调试，查找特定 DOM 结点，重复断点调试，即可理解相干执行逻辑

1. JS 虚拟机

• 应答：业余编程开发者。实例：暂无
• 通过 AST 转换 代码为二进制码，再通过虚拟机运行二进制码。
• 会导致网页执行性能变差，执行加载更多 JS 文件
• 无奈进行断点提醒，然而会把解密流程对外裸露。
• 间接调用 JS 虚拟机，执行最小化 JS 片段，从而理解整个虚拟机的加密规定。

1. 强制下载 APP 通过 Webview 关上

• 应答：中高级编程开发者。实例如：拼多多等
• H5 代码只是对外展现数据，要害内容提醒用户下载 APP，减少调试难度
• 用户不违心下载 APP，就会导致用户散失。

1. 接口校验 / 字段混同

• 应答：Python 爬虫类，实例如：淘宝、好词好句网等等
• 通过接口生成混同模版，多字段随机发送，配置相干 JS 模版框架。
• 接口内容传输 base64 / aes 加解密解决，然而会留下解密 JS 在客户端，仍旧可能被破解。
• Token 强制校验，发送三次谬误，间接不在返回数据，须要用户强制登录，容易导致用户散失。

1. 自定义框架

• 应答：Python 爬虫类，中高级编程开发者。实例如：亚马逊 / 淘宝。【还须要持续开掘】
• 爬虫无奈第一工夫获取相干按钮的 API 申请接口，须要期待 JS 返回。
• 客户端存在大量无关数据，导致 dom 结点整体看起来无规律
• JS 通过 接口申请返回，配合相干的 Token 参数，能够达到随机性下发

四、论断

4.1 大部分攻击者共同点

1）本身不违心登录，或者偷取失常用户信息后，用于攻打

• 如一些外挂程序，收费提供给内部用户，用户贪图小利，认为能够通过内部程序放慢抢利
• 实则被记录用户名，给到攻击者应用。

2）如果是公司行为，很可能会被记录 IP，有法务危险。

• 能够剖析电脑名称，IP 地址
• 可能会进行 IP 服务器代理，采纳虚构 IP，虚构定位
• 应用云服务器，如：阿里云 / 京东云，进行攻打相应的网站，京东云到京东网站。

3）屡次进行尝试批改 token，假装发送申请

• 伪造 UA
• 开启调试模式

4）剖析 DOM 结构特征 / 应用 Console 打印全局存储变量

5）通过 cookies 剖析特定的关键词，全局搜寻

6）网络申请时，查看函数执行栈，逐级往下寻找外围申请函数。

4.2 应答一般开发者外挂程序

• 次要采纳 puppeteer 就能够齐全模仿用户操作流程，能够进行期待某个节点呈现，之后再进行操作，不再须要传统的代码调试操作。间接操作 DOM 结点点击响应
• 基于此类需要，须要常常变更 DOM 结点地位。减少业务方老本，每次都须要发版。如果是随机生成结点特色，须要开发自研框架，老本较高

4.3 应答 Pyhton 爬虫

1）前端代码采纳传统加密形式

• https://github.com/mishoo/UglifyJS
• https://github.com/terser/terser
• https://github.com/javascript-obfuscator/javascript-obfuscator
• 更多偏向于 接口 加密形式，加固加 Token

2）入口在 APP 内的 业务

• 自身调试须要须要额定链接机器，进步调试复杂度。
• 配合 APP 本身监控，特定 API 能够做到更加平安
• 也只有此类业务，能够采纳 JS 虚拟机形式

3）对关键词进行混同解决，缩小特色搜寻

• 可采纳上面形式，只是举例，能够有更多形式。比方数组组合，对象组合等等
• const GLOBAL\_SOCKET\_NAME = ‘c6on6ne6ct’.concat(‘S6o’).concat(‘c6ke6t’).replace(/6/g, ”)
• 惯例代码混同中，对残缺字符串，不会进行解决，导致会间接裸露关键字。

任何客户端加密混同都会被破解，只有用心都能解决，咱们能做的就是迁延被破解的工夫，而不是什么都不做，那样只会被破解更快！

其实很多咱们本人公司对外的页面，都有很多外露危险，包含不标准的日志输入，间接对外裸露加密的防刷 token。比方：

大家都能够自查下～