抓包工具Charles的使用教程

charles的使用

charles的说明

Charles其实是一款代理服务器，通过过将自己设置成系统（电脑或者浏览器）的网络访问代理服务器，然后截取请求和请求结果达到分析抓包的目的。该软件是用Java写的，能够在Windows，Mac，Linux上使用。安装Charles的时候要先装好Java环境。

Charles的主要功能：

（1）截取Http 和 Https 网络封包。

（2）支持重发网络请求，方便后端调试。

（3）支持修改网络请求参数。

（4）支持网络请求的截获并动态修改。

（5）支持模拟慢速网络。

charles的下载和安装

1、安装包的下载

（1）进入官网下载地址：http://www.charlesproxy.com/，点击链接下载30天免费试用版本。

（2）云盘中文破解免费版：链接: https://pan.baidu.com/s/1PgqzfYmAiOUdDmonDai1aA 密码: azsb     

PS：Charles 是收费软件，可以免费试用 30 天。试用期过后，未付费的用户仍然可以继续使用，但是每次使用时间不能超过 30 分钟，并且启动时将会有 10 秒种的延时。因此，该付费方案对广大用户还是相当友好的，即使你长期不付费，也能使用完整的软件功能。只是当你需要长时间进行封包调试时，会因为 Charles 强制关闭而遇到影响。

https://www.zzzmode.com/mytools/charles/ 将补丁包charles.jar下载并覆盖到charles的lib文件下即可

charles与手机/电脑的连接

charles与手机端的连接

首先手机设置代理

设置手机代理：Ip查看Mac的ip，端口与charles一致。应该保证手机和电脑在同一wifi中吧

 

手机连接好charles后，会有提示，只需要点击“allow”

 https协议抓包

安装SSL证书到手机设备，点击 Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device

在手机Safari浏览器输入地址 chls.pro/ssl，出现证书安装页面，点击安装，

安装完成后，在 设置→通用→关于本机→证书信任设置，里面启用完全信任Charles证书

 这样手机端的包就抓取成功了。

 

注意：在Android7.0上抓包失败，可能是android安全策略问题，暂时无法解决。

另外，在电脑上安装证书如下：

电脑抓包

电脑设置代理，ip与charles一致，端口也一致

设置成功后，charles会有提示弹出框，选择同意，就可以进行抓包了

 过滤网络请求

Charles 主要提供两种查看封包的视图，分别名为 “Structure” 和 “Sequence”。可以根据具体的需要在这两种视图之前来回切换。

Structure：视图将网络请求按访问的域名分类。

Sequence：视图将网络请求按访问的时间排序。

 Charles 提供了简单的 Filter 功能，输入关键字来快速筛选出 URL 中带指定关键字的网络请求。对于某一个具体的网络请求，你可以查看其详细的请求内容和响应内容。如果请求内容是 POST 的表单，Charles 会自动帮你将表单进行分项显示。如果响应内容是 JSON 格式的，那么 Charles 可以自动帮你将 JSON 内容格式化，方便你查看。如果响应内容是图片，那么 Charles 可以显示出图片的预览。

通常情况下，需要对网络请求进行过滤，只监控指定服务器的请求。有3种办法：

方法一：在主界面的中部的 Filter 栏中输入需要过滤出来的关键字。例如我们的服务器的地址是：http://www.jianshu.com , 那么只需要在 Filter 栏中输入 jianshu 即可。

 

方法二：菜单栏选择 “Proxy”->”Recording Settings”，在弹出的窗口中选择 Include 栏，再点击“Add”，在弹出的窗口中输入需要监控的协议，主机地址，端口号等信息，来添加一个项目。如下图所示：

 

方法三：在想过滤的网络请求上右击，选择 “Focus”，之后在 Filter 一栏勾选上 Focussed 一项，如下图所示： 

 

可以临时性、快速地过滤掉一些没有通过关键字的网络请求。

charle的主界面介绍

界面简介

启动后，页面展示如下：

charle的主界面介绍

1.2.1 界面简介

启动后，页面展示如下：

 显示模式

Charles有两种显示模式，stucture 和sequence。支持来回切换。

(1) Structure形式如下图 优点：可以很清晰的看到请求的数据结构，而且是以域名划分请求信息的，可以很清晰的去分析和处理数据。

（2）Sequence形式如下图 优点：可以看到全部请求，这里的结果以数据请求的顺序来显示，最新的请求显示在最下面

综上，两种形式各有千秋，structure 适合对单一系列的访问请求从宏观上进行把握，可以快速定位。sequence 适合精确定位内容，因为每条sequence 都有size，status等属性信息，方便快速定位这条结果的价值.

对于我自己来说，更倾向于Charles的第一种树状视图，比fiddler的列表视图好的地方在于：多次刷新后的请求会被归纳到树里面，更加一目了然，用fiddler的时候，有点强迫症的同学，都要点击clear，有木有…

工具条简介

⑴~⑷ session

Charles有个会话(session，不是指http中的session)的概念，可以理解为浏览器中的tab，这个功能在需要调试多个站点页面时很实用，当你刷新页面的时候，只会在当前session中捕获请求。

(PS：ctrl+N创建个新的session，ctrl+W关闭当前session)

⑸垃圾桶———功能是clear，清理掉所有请求显示信息。

⑹搜索关键字（望远镜的那个）———功能是搜索关键字，也可以使用ctrl+f实现，可以设置搜索的范围。

⑺停止监控

———功能是领抓去的数据显示或者不显示的设置。 这个本人认为是charles工具很方便的一个，一般都使其为不显示抓取状态，只有当自己测试的时候的前后，在令其为抓取并显示状态。这样可以快准狠的获取到相关自己想要的信息，而不必在一堆数据请求中去寻找。

⑻开启/停止网速模拟

测试时，会用到网速模拟，具体的在后面功能部分介绍，此处略.....

⑼开启停止断点功能

⑽刷新单个请求

⑾编辑请求

编辑修改功能，可以对下图中的请求信息进行修改，修改完毕后点击Execute就可以发送一个修改后的请求数据包。

⑿校验请求的结果

⒀工具

⒁设置

 

 右键请求菜单

右键请求出现菜单，Charles的右键菜单功能比fiddler强大太多了。

 

请求详情

请求详情跟fiddler相似，但直观不少：

overview—请求总览

 

 

1）URL（统一资源定位符）

https:协议方案名

M.xxx.baidu.com:服务器地址，这里是DNS可解析的名称。同事也可以是ipv4d地址名，还可以是[0:0:0:0:0:0:0:1]这样用方括号括起来的IPV6地址名。

App/getindexPage：带层次的文件路径。指定服务器上的文件路径来定位特指的资源。

URL——请求url的路径、文件和查询字符串

Status——状态是否已完成

Notes——备注

Response Code——响应状态码

Protocol——该seesion使用的协议（Http/https/ftp）

SSLssl——协议版本号

Method——该seesion使用的方法（get/post/put等）

Content-Type——响应的content-type头

Timing ：

Request Start Time——接收到的第一个请求的第一个字节的时间点

Request End Time——发送到客户端的最后一个响应的最后一个字节的时间

Response Start Time——响应开始时间

Response End Time——响应结束时间

Duration——整个请求—响应持续时间

DNS——所有选中的session解析DNS所花费的时间的总和

Connect——所有选中session建立TCP/IP连接所花费的时间总和

Request——请求耗费时间

Response——响应耗费时间

Size 

Request Header——请求头大小

Response Header——响应头大小

Request 

Response 

Total——请求头+响应头字节大小

request—请求头

package request;

import java.io.IOException;
import java.lang.reflect.InvocationTargetException;
import java.util.Enumeration;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.beanutils.BeanUtils;

import bean.User;

import com.sun.org.apache.regexp.internal.REUtil;
//获取请求头
//获取请求数据的时候一般都要先检查，再使用
public class RequestDemo2 extends HttpServlet {
    
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取客户端超链接或表单提交过来的数据
        //1，直接获取
        String value = request.getParameter("username");
        //先判断value的值是否符合要求，再使用
        if(value!=null && !value.trim().equals(""))
            System.out.println(value);
        
        System.out.println("--------------");
        //通过提交数据的名称获得值
        //2，先得到所有名称，再根据名称获得值
        Enumeration e = request.getParameterNames();
        while (e.hasMoreElements()) {
            String name = (String) e.nextElement();
            value = request.getParameter(name);
            System.out.println(name +" = "+value);
        }
        
        System.out.println("--------------");
        
        //3,获取指定名称的所有值
        String[] values = request.getParameterValues("username");
        //这样写程序健壮性不够，如果客户机表单没有填写数据就提交，此时values就为空
        //执行下面的语句就会报空指针异常
//        for(String v:values){
//            System.out.println(v);
//        }
        //这样写，才不会报措
        for(int i=0;values!=null && i<values.length;i++){
            System.out.println(values[i]);
        }
        
        //4
        Map map = request.getParameterMap();
        User user = new User();
        try {
            BeanUtils.populate(user, map);
        } catch (Exception e1) {
            e1.printStackTrace();
        }
        System.out.println(user);
    }

    //获取头相关的数据
    private void test1(HttpServletRequest request) {
        //获取头信息
        //1
        String headValue = request.getHeader("Accept-Encoding");
        System.out.println(headValue);
        
        System.out.println("-----------------------");
        //2
        Enumeration e = request.getHeaders("Accept-Encoding");
        while(e.hasMoreElements()){
            String value = (String) e.nextElement();
            System.out.println(value);
        }
        System.out.println("-----------------");
        //3
        e = request.getHeaderNames();
        while (e.hasMoreElements()) {
            String name = (String) e.nextElement();
            String value = request.getHeader("name");
            System.out.println(value);
            
        }
    }

    
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

}
/********************************************************html页面**********************************************************************************/

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>提交数据</title>
</head>
<body>
    <!-- 超链接给服务端带数据 -->
    <a href="/requestandresponse/RequestDemo2?username=xxxxxx">点点</a>
    <!-- 表单给服务器带数据 -->
    <form action="/requestandresponse/RequestDemo2" method="post">
        用户名：<input type="text" name="username"/>
        <input type="submit" value="提交">
    </form>
</body>
</html>

 response—请求结果

Json格式，具体含义参考接口文档。（其中raw是原始数据包的状态）

 

 summary—请求详情，包含加载时间等

时间线图表

常用的功能 

模拟网速功能

暂时开始慢网速，这个说实话，我自己是不常用的，也就偶尔上线测试看下，或者查看可能存在的加载导致错误，很多次上线钱我甚至都忘记看了；

这个说的直白点，就是模拟手机上2G/3G/4G的速度；让你感受下慢网速的蛋疼之处，从而逼迫你优化你的代码；嗯，就是这样的功能；

同时需要注意你的慢速设置，当你不用的时候请记得关闭它，否则访问速度就是你设置的限制速度。。

这个对应工具栏的的小乌龟图标，

 设置如下

一般选择多少网速就可以了，下面默认即可；

注意如果你本身网速快；是限速；如果你网速low，你选个100Mbps的，其实也到不了的；

 

修改网络请求内容

Charles可以方便地提供网络请求的修改和重发功能。这也可以解决我们，为了修改谋其格请求，或者反复尝试不同参数的网络请求的需求。方法是：只需要在以往的网络请求上点击右键，选择 “Edit”/点击铅笔图标，即可创建一个可编辑的网络请求。如下所示：

我们可以修改该请求的任何信息，包括URL地址、端口、参数等，之后点击 “Execute” 即可发送该修改后的网络请求（如下图所示）。Charles 支持我们多次修改和发送该请求。

 

 重复发送网络请求

（1）Repeat：此功能此功能对于测试同学特别有用，可以检验接口的健壮性。对于前端的价值是不需要刷新页面，只需要repeat请求，比如检验代理是否成功，修改请求后执行等。使用方法：选择请求后，右击Repeat就是重复发送一次请求。 

（2）Advanced Repeat可以自定义重复次数和重复间隔，重复发送多次请求。可以来简单地测试服务器的并发处理能力，方法如下：我们在想打压的网络请求上（POST或 GET 请求均可）右击，然后选择 「Repeat Advanced」菜单项。然后在弹出的对话框中，选择打压的并发线程数以及打压次数，确定之后，即可开始打压。（iteration:迭代次数，Concurrency:并发数,repeat为时间间隔）。

修改服务器返回内容

有些时候我们想让服务器返回一些指定的内容，方便我们调试一些特殊情况。例如列表页面为空的情况，数据异常的情况，部分耗时的网络请求超时的情况等。如果没有Charles，要服务器配合构造相应的数据显得会比较麻烦。这个时候，使用 Charles 相关的功能就可以满足我们的需求。

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

△Map功能适合长期地将某一些请求重定向到另一个网络地址或本地文件。

△Rewrite功能适合对网络请求进行一些正则替换。

△Breakpoints功能适合做一些临时性的修改。

MAL

在Charles的菜单中，选择 “Tools”->”Map Remote” 或 “Map Local” 即可进入到相应功能的设置页面。

（1）map remote

对于Map Remote功能，我们需要分别填写网络重定向的源地址和目的地址，对于不需要限制的条件，可以留空。

（2）map local

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

方法是：

1.请求右键—save response，然后另存在自己电脑的某个位置（文件属性必须为.txt）

2.请求右键/tools—MAPlocal，然后添加你刚才保存的文件，点击OK保存

3.右键请求，选择repeat

4.重新刷新app的页面，会看到数据已经修改过来了。

5.去掉代理配置：取消勾选Tools—Maplocal即可

Rewrite

Map Local在使用的时候，有一个潜在的问题，就是其返回的 Http Response Header 与正常的请求并不一样。这个时候如果客户端校验了 Http Response Header 中的部分内容，就会使得该功能失效。解决办法是同时使用 Map Local 以下面提到的 Rewrite 功能，将相关的 Http 头 Rewrite 成我们希望的内容。

Rewrite功能功能适合对某一类网络请求进行一些正则替换，以达到修改结果的目的。

例如：我们的客户端有一个API请求是获得用户昵称，而我当前的昵称是 “XXXX”。我们想试着直接修改网络返回值，将“XXXX”替换成“测试测试下”。

步骤是：

1.选中请求，然后在Tools—右键选择rewrite功能；

2.在弹出的提示弹窗中，选择add-rules

3.完成设置之后，右键请求，选择 repeat。然后我们就可以从 Charles 中看到，之后的 API 获得的昵称被自动 Rewrite 成了 测试测试下，如下图所示：

断点功能（Breakpoints）

上面提供的Rewrite功能最适合做批量和长期的替换，但是很多时候，我们只是想临时修改一次网络请求结果，这个时候，使用 Rewrite 功能虽然也可以达到目的，但是过于麻烦，对于临时性的修改，我们最好使用 Breakpoints 功能。

Breakpoints，当指定的网络请求发生时，Charles 会截获该请求，这个时候，我们可以在 Charles 中临时修改网络请求的返回内容。

Charles能够断到发送请求前(篡改Request)和请求后(篡改Response)。

使用断点修改请求的弊端是，如果开发设置了请求超时时间，那么修改的速度慢了往往即使返回了也没有效果，所以实际测试中使用此方法的场景并不多。

这里以将我的券金额修改为13.00元为例：

（1） 针对接口右键选择"BreakPoints",这样这个接口就被加入到断点状态了；

（2）需要进一步修改断点的属性，可以在菜单栏"Proxy"–>"Breakpoints Settings"里进行添加删除或者修改，并且可以选择这个断点是在request还是response，还是两者都要。这里只是修改response

(3)刷新app界面，跳转到断点模版，这个时候你可以在对应状态情况下修改request或者response,然后点击下方按钮“Execute”。点开Edit Response界面，选择JSON格式，格式清晰，方便修改，直接在上面进行数据修改，改成你想要测试的数据，然后点击执行按钮

(4)再次刷新app界面，然后app返回的是新改的数据，根据返回数据测试客户端显示是否正确

1.3.6 查看连接本机charles代理的ip

这里可以看到连接自己charles代理的IP，针对某些不需要的/未知用户，点击remove即可

设置请求的黑名单

不想某些请求发起，直接返回404，可以用黑名单。选择Tools-Blacklist，设置如下图：