Charles之App开发使用

Charles 是我们app开发人员常用的截取网络封包的工具。Charles通过将自己设置成网络访问代理，能够监听到所有的网络请求，从而实现网络的截取和分析。

Charkles 主要的功能包括：

• 支持SSL代理

• 支持流量控制

• 支持AJAX调试。可以自动将JSON或XML数据格式化，方便查看

• 支持AMF调试，可以将Flash Remoting 或Flex Remoting信息格式化

• 支持重发网络请求，方便后端调试

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

Charles的安装和使用

点击下载Charles 下载最新版本的Charles安装包

将Charles设置成系统代理

使用Charles的第一步就是将其设置成代理服务器来完成封包截取。

第一次启动Charles 会提示你设置成代理。也可以忽略请求，然后在需要将Charles设置成系统代理时，选择菜单中的”Proxy” -> “Mac OS X Proxy”来将Charles设置成系统代理,之后就能看到源源不断网络请求。

Charles 主要提供两种查看封包的视图，分别为“Structure” 和 “Sequence”, 它们的功能分别为：  * Structure视图将网络请求按访问的域名分类。  * Sequence 视图将网络请求按访问的时间排序

过滤网络请求

• 在主界面的中部的Filter栏中填入需要过滤出来的关键字。例如我们的服务器的地址是https://wsy.com 那么我只需要在Filter栏中填入wsy即可。
• 在Charles的菜单栏选择“Proxy”->”Recording Settings”，然后选择Include栏，选择添加一个项目，然后填入需要监控的协议，主机地址、端口号。这样就可以只截取目标网站的封包了，如下图：
  

通常情况下 我们使用前一个做一些临时性的封包过滤，后一个做一些经常性的封包过滤

使用Charles协助app开发

Charles通常用来截取本地的网络封包，但是当需要时，我们也可以用它来截取其他设备上的网络请求。下面我就以iPhone为列。

Charles上的设置

要截取iPhone上的网络请求，首先需要打开Charles的代理功能，在Charles的菜单栏上选择”Proxy” -> “Proxy Settings”, 填入代理端口8888，并且勾选”Enable transparent HTTP proxying”,就完成了Charles的设置如下图：

iPhone上的设置

首先 我们要先获得Mac上的ip地址，打开Terminal 输入ifconfig en0,如下图获得该电脑的IP地址：

在iPhone上的“设置”->“无线局域网”中，可以看到当前连接的WIFI名，通过单击右边的详情按钮，可以看到当前连接上的WIFI的详情信息，包括IP地址、子网掩码等信息。在其最底部有“HTTP代理”一项，我们将其切换成手动，然后填上Charles运行所在的电脑的IP地址，以及端口号8888，如下图：

设置好后，打开iPhone上的任意应用请求网络，就可以看到Charles弹出请求连接确认菜单，单击“Allow”按钮即可完成设置，如下图：

模拟慢速网络

在做app开发时，我常常需要模拟慢速网络或者高延迟的网络，以测试在移动网络下的应用表现是否正常。Charles对此需求提供了很好的支持。
在Charles的菜单上，选择“Proxy” -> “Throttle Setting”项，在弹出的对话框中，我们可以勾选上”Enable Throttling”, 并且可以设置Throttle Preset的类型，如下图：

如果我们只想模拟指定接口的慢速网络，可以在上图中勾选”Only for selected hosts”项，然后在对话框的下半部分设置中增加指定的Host即可。

截取SSL信息

Charles默认并不截取SSL的信息，如果你想截取某个网站上所有的SSL网络请求，可以在该请求上单击右键，选择“Enable SSL Proxying”,如下图。

这样，对于该HOST的所有SSL请求都可以被截取到了。

修改网络请求内容

在app开发中为乐调试接口，我们需要反复尝试不同参数的网络请求。Charles可以方便地提供网络请求的修改和重发功能。只需要在你要选择的网络请求上单击上面菜单栏的的编辑图案即可，即可创建一个可编辑的网络请求。如下图

通过以上我们可以修改请求的任何信息，包括URL地址、端口、参数等等，之后单击“Execute”按钮即可发送修改后的网络请求

修改服务器返回内容

根据具体的需求，Charles提供了Map功能，Rewrite功能及Breakpoints功能，它们都可以达到修改服务器返回内容的目的。这三者在功能上的差异是：

• Map功能适合长期地将某一些请求重定向到另一个网络地址或本地文件。
• Rewrite功能适合对网络请求进行一些正则替换
• Breakpoints功能适合做一些临时性的修改

Map功能

Charles的Map功能分Map Remote 和 Map Local两种，顾名思义，Map Remote是将指定的网络请求重定向到另一个网址，Map Local是将指定网络请求重定向到本地文件。在Charles的菜单中，选择”Tools”->”Map Remote”或“Map Local”即可进入相应功能的设置页面，如下图所示。

对于 Map Remote 功能，我们需要分别填写网络重定向的源地址和目的地址，对于不需要限制的条件，可以留空，下图是一个示列，将所有192.168.2.234(测试服务器)的请求重定向到了www.wsy.com(线上服务器)。

对于Map Local功能，我们需要填写重定向的源地址和目标文件。对于一些复杂网络请求结果，我们可以先用Charles提供的”Save Response …”功能，将请求结果保存到本地，如下图，然后稍加修改，使其成为我们的目标映射文件。

Rewrite功能

Rewrite 功能适合对某一类网络请求进行一些正则替换，以达到修改结果的目的。例如，我们app有一个API请求是获取用户信息，而我当前的昵称是”dingqiankun”
我们想试着直接修改网络返回值，将”dingqiankun”换成“dingnan”，于是我们启用Rewrite功能，然后按下图进行设置。

完成设置之后，我们就可以从Charles中看到，之后的API获得的昵称被自动Rewrite成了“dingnan”

Breakpoints功能

Rewrite功能最适合做批量和长期替换，但是很多时候，我们只是想临时修改一次网络请求结果，使用Rewrite功能虽然也可以达到目的，但是过于麻烦，对于临时性修改使用Breakpoints。
如下图所示临时修改获取用户信息的API，将用户的昵称进行 了更改，修改完成后单击“Execute”按钮就可以让网络请求继续进行。