charles抓包的安装，使用说明以及常见问题解决(windows)

charles抓包的安装，使用说明以及常见问题解决(windows)

Charles 主要的功能包括：

1 . 截取 Http 和 Https 网络封包。
2 . 支持重发网络请求，方便后端调试。
3 . 支持修改网络请求参数。
4 . 支持网络请求的截获并动态修改。
5 . 支持模拟慢速网络。

一 、安装

• 百度云盘破解版安装包下载： 链接: https://pan.baidu.com/s/1kV3h0gf 密码: nqaa
• 官网下载：https://www.charlesproxy.com/download/

笔者使用的版本是：

二、使用说明

1 . 在手机上抓包 配置过程：（安装完成，即可在PC机上直接使用，不需要配置！）

1 . 查看本机的IP 地址：

• 方法一： 打开”运行”（快捷键：win+R键；或者在任务栏的”搜索”按钮中查找并点击”运行”），输入“cmd”后进入命令行窗口，在命令行窗口中输入”ipconfig”命令查看IP
  

  

• 方法二： 在charles中查看 ：Help -> Local IP Address

  
  

2 . 查看端口：

3 . 在手机设备或者远程浏览器上设置代理，抓取手机设备上的请求包（手机和电脑必须在同一个局域网内，并关闭电脑防火墙、其他代理或者软件）

• 第一步：在手机wifi 上设置代理 -> 手动

  • 服务器IP：PC机器的IP（通过之前介绍的查看IP的方法）
  • 端口号：8888（通过之前介绍的查看端口的方法）
    

• 第二步：Charles弹出询问“allow”或者“deny”,点击“allow”按钮允许；

• 第三步：抓取https数据需要在手机上安装证书

  Help -> SSL proxying -> Install charles root certificate on a Mobile Device or remote browser…

  复制弹出层上的地址 http://charlesproxy.com/getssl或http://www.charlesproxy.com/ssl.zip 到手机浏览器打开，点击 here 下载，安装，信任；

  截取https信息，pc机上也需要安装Charles的CA证书，还需要设置 SSL 代理

  • 菜单栏 Help -> Install Charles CA SSL Certificates…
    

    
    

  • 设置SSL代理

    • 选择Proxy -> SSL Proxying Settings -> SSL Proxy -> Add
    • Host : * (使用通配符表示检测所有网络请求；建议还是设置单个需要抓取的https host，尽量避免使用 * 通配符)
    • Port：443
  
  ！！！完成以上操作，就完成Charles抓取HTTP(S)数据包的所有配置了。查看Charles,我们可以看到数据包的内容了。
  

2 . 抓包字段的详细说明：

• Structure：树状结构显示，将网络请求按访问的域名分类；
• Sequence：水平结构显示，将网络请求按访问的时间排序
• 垃圾桶图标 ： 功能是clear，清理掉所有请求显示信息
• Filter ： 过滤，可以输入关键字来快速筛选出 URL 中带指定关键字的网络请求
• Overview ： 查看这次请求的详细内容，例如耗时详细列车了请求开始时间、结束时间，响应开始时间、结束时间，总耗时、DNS耗时、网络延时等。
  对于Size也详细列出了请求头大小、响应头大小、压缩比例等内容。
  
  • 
    
    • URL：进行网络请求的链接；
    • Status：当前状态，complete表示请求完成；
    • Responce Code：返回码。不同的接口，不同的请求结果，返回码都不同；
    • Protocol：使用的协议；
    • Method：请求方式，如GET请求，POST请求等；
    • Kept Alive：判断当前是否正在链接（活跃）；
    • Content-Type:发送的内容类型，如这里用的是XML文本，以UTF8的方式发送；
    • Client Address：客户端的IP地址；
    • Remote Address：远程服务器的IP；
  • Timing:
    
    • Request Start Time：请求开始的时间；
    • Request End Time：请求结束的时间；
    • Response Start Time：返回开始的时间；
    • Response End Time : 返回结束的时间；
    • Duration : 总时间；
  • Size:
    
    • Request Header ：请求的头部大小；
    • Response Header：返回的头部大小；
    • Request : 请求发送的大小；
    • Response：返回数据的大小；
    • Total：所有数据大小；
    • Request Compression : 请求压缩；
    • Response Compression : 返回压缩；
• Request ： 查看请求内容（底下的Headers，Query String，Cookies，Raw。）
  
  • Headers：发送请求的头部信息；
  • Query String : 发送参数列表；
  • Cookies： 浏览器缓存；
  • Raw：发送的原生数据，包括了头部和参数；
• Reponse : 查看响应内容
  
  • Headers：是返回的头部信息；
  • Text：返回信息（除去头部）后的文本；
  • Hex：返回信息的16进制表示；
  • XML：我返回的数据是XML。如果你返回的是JSON，这里就会显示JSON；
  • XML Text：如果你返回JSON，这里会显示JSON Text；
  • Raw：返回的所有原生数据，包括头部；
• Summary: 查看发送数据的一些简要信息（主机，状态码，数据的类型，header和body大下，加载时间，总时间）
• Chart: Summary中简要信息以图表形式展示
• Notes: 其他信息

三、过滤网络请求

作用：快速筛选出 URL 中带指定关键字的网络请求。

• 方法一 ： 在界面中部的 Filter 输入框中输入需要过滤的关键字，即可快速筛选出相关网络请求。（临时性的包过滤)

• 方法二 ： Charles菜单栏 -> Proxy ->Recording Settings ->include。（经常性的包过滤)

• 方法三 ： 选中想过滤的网络请求，单击右键 -> 勾选Focus，然后在界面中 Filter输入框右侧的Foucssed选中。（临时性的包过滤)

四、设置映射（Map）

Map分 Map Remote 和 Map Local 两种。

• Map Local : 将指定的网络请求重定向到本地文件。
• Map Remote : 将指定的网络请求重定向到另一个网址请求地址。

1 . 设置本地映射（Map Local）

作用：把线上的静态资源映射到本地：这样当请求静态的html、js和css等资源的时候会使用本地的信息，方便调试并及时看效果。

1 . 设置本地映射

• 第一步： 选中某一条包数据，右键，选择最低端的 Map Local

• 第二步：修改 path 为
  如： 【/yundai/*】 这样的地址，设置local path 为【E:\webstorm\yd_h5\debug\】 这样的本地路径；
  表示所有的域名+/yundai/下面的目录都替换成，本地路径下的相对应的文件；

2 . 查看所有的本地映射

• Tools -> Map Local , 可以查看所有的本地映射配置。

• 在Overview的Nodes中查看。

  

2 . 设置远程映射（Map Remote）

1 . 设置远程映射

• 第一步： 选中某一条包数据，右键，选择最下面的 Map Remote
  

  

• 第二步：将请求映射到远端写好的接口。推荐一个生成接口的链接 Mocky：http://www.mocky.io/
  如： 本地请求按 协议、主机、端口、路径和参数分别对应远程接口的相关字段，没有则不填；

2 . 查看所有的远程映射

• Tools -> Map Remote , 可以查看所有的本地映射配置。

• 在Overview的Nodes中查看。

  

3 .重发网络请求

• 选中某调请求，右键选则 “Repeat”重复发送一次该请求；

• 选中某调请求，右键选则 “Repeat Advanced…”设置请求次数（Iterations），重复间隔（Concurrency），重复发送多次该请求。

  
  

4 . 修改网络请求参数

1.选中一条请求，右键选择“Edit”，就可以编辑请求内容。

2.在编辑框中修改请求内容，“cancle”取消修改，“Revert”恢复原状，返回原来的状态，“Excute”执行修改的请求。

3.修改完成之后，点击“Excute”，执行修改的请求。

4.返回修改后的响应内容。

5 . 网络请求的截获并动态修改

• 方法一：本地映射
  
  • Charles进行抓包
  • 选择某一个网络请求 > 鼠标右键 Save Response…
  • 如果该请求返回的是一个json串，保存文件时需要保存rename.json
  • 需要更改的请求点击右键 Map Local.. 指定到本地保存的renam.json.
  • 通过在本地更改rename.json就可以自动的更改请求的返回值。

• 方法二：打断点（Breakpoints）

  • 选择某一个网络请求 > 鼠标右键 Breakpoints
  • 然后点击 Execute 执行，然后编辑返回值。
  • 缺点：容易请求超时。还没等你调整完返回数据，app那边已经请求超时了。
  
  
  
  
  

• 方法三：远端映射

  • 将App内部的请求映射到远端写好的接口。推荐一个可以自己生成接口的链接： Mocky：http://www.mocky.io/。
• 方法四：rewrite（mac上支持，但在windows上有点问题，暂不支持该方法）
  
  • 菜单栏 Tools —> Rewrite
  • 根据自己的需求重写…。
  • 推荐网址：http://www.cnblogs.com/wonyun/p/5586746.html

常见问题解决

1 . 手机无法抓包的问题

• 检查是否配置好代理IP,端口号
• 检查是否与电脑在同一个局域网
• 检查是否关闭防火墙，代理，软件
• 弹出询问点击“allow”或者“deny”时，误点“deny”，关闭charles重启，手机再次浏览则会重新弹出询问

2 . 解决request和response信息中的中文乱码问题。

• 方法一 ：修改charles windows版本安装目录下也有一个Charles.ini的配置文件
  
  • 原配置文件

working.directory=.
classpath.1=lib/charles.jar
main.class=com.xk72.charles.gui.MainWithClassLoader
vm.version.min=1.4
vm.heapsize.preferred=256M
vm.location=jre\bin\client\jvm.dll
vmarg.1=-Dsun.java2d.d3d=false
vmarg.2=-Djava.net.preferIPv4Stack=true
dde.enabled=true
dde.class=com.xk72.charles.win32.Win32DDEManager
dde.server.name=Charles
dde.topic=System
single.instance=dde

[ErrorMessages]
java.not.found=A suitable Java installation was not found. Please visit http://java.com/ to install Java.
java.failed=The Java installation is broken. Please uninstall and reinstall Java from http://java.com/

• 
  
  • 修改后的配置文件 增加vmarg.3参数，并设置编码格式为UTF-8

working.directory=.
classpath.1=lib/charles.jar
main.class=com.xk72.charles.gui.MainWithClassLoader
vm.version.min=1.4
vm.heapsize.preferred=256M
vm.location=jre\bin\client\jvm.dll
vmarg.1=-Dsun.java2d.d3d=false
vmarg.2=-Djava.net.preferIPv4Stack=true
vmarg.3=-Dfile.encoding=UTF-8
dde.enabled=true
dde.class=com.xk72.charles.win32.Win32DDEManager
dde.server.name=Charles
dde.topic=System
single.instance=dde

[ErrorMessages]
java.not.found=A suitable Java installation was not found. Please visit http://java.com/ to install Java.
java.failed=The Java installation is broken. Please uninstall and reinstall Java from http://java.com/

• 方法二 ： Tools -> Rewrite… -> Rules -> Add –>配置信息
  
  • 选中 Request 和 Response
  • Match
    
    • Name : Content-Type
    • Value : application/x-zip
  • Replace
    
    • Name : Content-Type
    • Value : application/json;charset=UTF-8
  • 选中 Replace All

–》点击OK，完成配置。

！！！通过以上方法就可以解决Request和Response的中文乱码问题了。

3 . 本地映射配置错了，删除错误的映射

• Tools -> Map Local… -> 选中需要删除的映射 -> Remove -> OK

更多资料参考 【抓包工具Charles的使用心得】(http://www.jianshu.com/p/fdd7c681929c)

【MAC上charles使用教程总结】(http://www.jianshu.com/p/18449f5f9d1c)

【Charles 从入门到精通】(http://blog.devtang.com/2015/11/14/charles-introduction/)

注意：不抓包请关闭手机HTTP代理，否则断开与电脑连接后会连不上网