Charles官网全方位解析

一、简介

Charles是一款MacOS平台下的网络代理工具，主要功能是拦截并记录网络浏览器和其他应用程序之间的数据通信。它广泛应用于Web开发的调试和测试，也可以用于检测恶意软件、跟踪用户行为分析等。

二、功能特点

1、HTTP/SSL代理
Charles可以作为HTTP代理，截获浏览器发送的请求和服务器返回的响应，方便在请求和响应之间进行修改和重放。同时，它也支持截获SSL/TLS加密流量，并可以有效解密SSL/TLS连接。

2、请求重发
当发现有一次请求有问题时，Charles可以直接重新发送该请求，而无需手动再次输入相同的请求参数。这样可以提高调试效率，并方便开发人员处理需求。

3、数据流分析
实时观察和分析数据流，获取请求和响应详细信息，方便开发人员进行调试，如查看HTTP请求/响应报文头，请求参数列表和响应内容等。此外，还支持JSON和XML格式的数据格式化展示。

4、自动化脚本
Charles支持JavaScript脚本编写，可以用来进行自动化测试和模拟测试。这将减少手动测试成本，同时提高测试的准确率。

5、网络限速
为模拟较慢的网络环境，可以设置网络限速模式，从而更好的测试应用程序在不同网络环境下的性能和表现。

三、使用教程

1、安装和运行
下载安装 Charles，在Mac APP Store或官方网站下载即可。运行前可先保存之前设置的代理，再进行运行。

  # 代码示例
  brew install charles

2、重设代理
用Charles作为代理时，需将浏览器代理设置为127.0.0.1:8888。可以在Charles的菜单栏中选择 Proxy -> Proxy Settings…来进行代理设置。

  # 代码示例
  PORT=8888
  http_proxy=http://127.0.0.1:$PORT
  https_proxy=$http_proxy

3、截获和分析数据
打开浏览器，在地址栏输入想要访问的网站，浏览器便会通过Charles进行访问。Charles会记录下所有的请求及其响应，可在“Structure”选项卡中进行观察。此外，还可以选择“Sequence”选项卡对请求/响应视图进行查看和筛选。

  # 代码示例
  if (window.XMLHttpRequest) {
     xmlhttp=new XMLHttpRequest();
  } else {
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
     if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
     }
  }
  xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);
  xmlhttp.send();

4、请求/响应设置
在Charles中，可以进行相关的请求/响应编辑，如重发、修改或删除请求。右键点击选中的请求，选择相关操作即可。

  # 代码示例
  Request:
  GET /try/ajax/ajax_info.txt HTTP/1.1
  Host: www.w3school.com.cn
  Connection: keep-alive
  Pragma: no-cache
  Cache-Control: no-cache
  Accept: */*
  User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.115 Safari/537.36
  Referer: http://www.w3school.com.cn/tiy/t.asp?f=html_form_submit
  Accept-Encoding: gzip,deflate,sdch
  Accept-Language: zh-CN,zh;q=0.8,en-US;q=0.6,en;q=0.4

5、自动化脚本运行
Charles通过JavaScript脚本来进行自动化测试，选择“Tools”选项卡，再选择“Scripting”，即可打开JavaScript编辑界面。

  # 代码示例
  function onRequest(context, next) {
      var requestFilter = {
          urls: ["http://example.com/*"]
      };
      var flow = context.getCurrentFlow();
      if (!requestFilter || requestFilter.urls.indexOf(flow.request.url) >= 0) {
          // 对请求进行处理，可以拦截或重写等
      }
      // 转移给下一个请求或者响应器
      next();
  }
  function onResponse(context, next) {
      // ...
      next();
  }

四、总结

Charles是一款功能强大的网络代理工具，作为Web开发和测试的利器，使得开发工作变得更加轻松和高效。此外，通过Charles还可以进行数据流分析、请求重发、SSL/TLS流量解密和网络限速等操作，进一步提高开发和测试的效率和准确性。