移动端手机抓包工具小助手

最近移动端项目中用了weex框架，页面打断点得时候开了本地服务，内存变得有些紧张了，如何通过抓包工具快速得到服务端返回的信息呢，通过查阅发现了个方便的小助手，下面请看详细的流程：

下面介绍一下关于抓包工具Charles 的使用，首先需下载一个Charles 工具（下载地址：https://www.charlesproxy.com/）
Charles主要功能

• • 支持SSL代理。可以截取分析SSL的请求。
• • 支持AJAX调试。可以自动将json或xml数据格式化，方便查看。
• • 支持AMF调试。可以将Flash Remoting 或 Flex Remoting信息格式化，方便查看。
• • 支持重发网络请求，方便后端调试。
• • 支持修改网络请求参数。
• • 支持网络请求的截获并动态修改。

• • 检查HTML，CSS和RSS内容是否符合W3C标准。

  下面给大家介绍下Charles 工具的操作步骤。
   

电脑端配置

安装后首先进行代理设置：Proxy-Proxy Settings 然后在Proxies的port设置端口（默认8888）这个只要不和其他程序的冲突即可,并且勾选Enable transparent HTTP proxying。

• 大家可以在浏览器上访问下网站，请求的信息会显示在Charles 中

• 如果是https请求出现的乱码，如下图这种情况

• 这时候你就需要安装Charles的CA证书了，按照下面截图操作安装证书，help-ssl Proxying-Install Charles root cetrificate。
 

手机端配置

• 当然如果手机端也要抓取HTTPS请求也需要安装证书的，先在手机端设置代理，然后在手机浏览器上输入chls.pro/ssl。（注意：保持Charles服务是开启状态）

手机端设置代理

• 找到你所连接的的WiFi然后点击进入设置项。

 

• • 然后给证书命名，点击确定，这样Charles就可以抓取手机访问的HTTPS请求了。

• • iOS版本证书安装

• • 设置-通用-描述文件与设备管理器

  

• • Android版本证书安装，证书名称自定义即可。

• 下面简要介绍下抓包要看的信息。
• • 请求链接和请求状态在Overview中查看

• 请求返回信息

•