js逆向 webpack_Javascript逆向分析前端加密接口

前言

在平时，我们前端日常工作中，几乎不会接触到去逆向分析 javascript ，因为通常会使用 Webpack ， Parcel 等打包工具来完成前端工程化。去看自己的工程即可。但是，如果反过来对自己感兴趣的网站进行学习和抓取，那么就会导致这项技能是必会的，本文带领大家了解其中逆向的一些技巧和分析思路。

准备工作

首先，对大家来说是有一些门槛的。你首先要掌握以下的知识，才能一步一步听懂我说的东西：

chrome调试工具断点熟悉

牢固的 Javascript 基础

需求背景

目前，我们假定有一个这样的需求，某网站采用了以下方式进行加密接口，导致爬虫无法进行抓取数据，因此我们需要逆向分析加密方式来完成抓取。这里为了便于理解，我画了一张图：

原理其实非常简单，如果你是爬虫程序，那么不带这个指定算法完成后的key返回给服务器，那么服务器就会拒绝这次请求。非常轻松的区分了人机。

目标网站分析

首先打开 Chrome DevTools 我们在 Network 面板里面，我们发现了这个有意思的接口，但是情况比我们之前预想的要复杂(真正实战中，你也会碰到各种奇葩的变异套路)我这里只是遇到了这一种，看起来貌似它校验了三个不同的参数。

根据响应报文，我们看到这里的重点是分析 s 和 p 变量以及这个ture的长参数是怎么计算出来的。

听到这里，我想有大家可能会有疑惑：

问：为什么你这么确定这三个 s p ture 一定是前端加密算出来的呢？

答：非常简单，在DevTools里面 对所有的资源进行一次搜索这些对应的key值，看看能不能找到，如果能找到，说明服务器那边传来的，如果找不到，必定是前端根据某种规则生成的。另外，如果是服务器本身传来的，也不需要逆向了，直接抓取对应的js/html拿出来即可。

问：我用上次生成的这三个随机参数去访问不行吗？

答：这