HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

作为一名web开发或者测试人员,进行http抓包分析和http请求代理,是一项必备的技能,这样才能更加准确的debug或者测试接口,今天小编给大家介绍下代理神器,Charles

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

首先简单介绍一下

Charles是一个HTTP代理服务器,HTTP监视器,反转代理服务器,当浏览器连接Charles的代理访问互联网时,Charles可以监控浏览器发送和接收的所有数据。它允许一个开发者查看所有连接互联网的HTTP通信,这些包括request, response和HTTP headers (包含cookies与caching信息)。

我常借用Charles做这些事情 :

抓取 Http 和 Https 的请求和响应,抓包是最常用的了。

重发网络请求,方便后端调试,复杂和特殊情况下的一件重发还是非常爽的(捕获的记录,直接repeat就可以了,如果想修改还可以修改)。

修改网络请求参数(客户端向服务器发送的时候,可以修改后再转发出去)。

网络请求的截获和动态修改。

支持模拟慢速网络,主要是模仿手机上的2G/3G/4G的访问流程。

支持本地映射和远程映射,比如你可以把线上资源映射到本地某个文件夹下,这样可以方面的处理一些特殊情况下的bug和线上调试(网络的css,js等资源用的是本地代码,这些你可以本地随便修改,数据之类的都是线上的环境,方面在线调试);

可以抓手机端访问的资源(如果是配置HOST的环境,手机可以借用host配置进入测试环境)

将 Charles 设置成系统代理

之前提到,Charles 是通过将自己设置成代理服务器来完成封包截取的,所以使用 Charles 的第一步是将其设置成系统的代理服务器。

启动 Charles 后,第一次 Charles 会请求你给它设置系统代理的权限。你可以输入登录密码授予 Charles 该权限。你也可以忽略该请求,然后在需要将 Charles 设置成系统代理时,选择菜单中的 “Proxy” –> “Mac OS X Proxy” 来将 Charles 设置成系统代理。如下所示:

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

之后,你就可以看到源源不断的网络请求出现在 Charles 的界面中。

需要注意的是,Chrome 和 Firefox 浏览器默认并不使用系统的代理服务器设置,而 Charles 是通过将自己设置成代理服务器来完成封包截取的,所以在默认情况下无法截取 Chrome 和 Firefox 浏览器的网络通讯内容。如果你需要截取的话,在 Chrome 中设置成使用系统的代理服务器设置即可,或者直接将代理服务器设置成 127.0.0.1:8888 也可达到相同效果。

移动端抓包

1)使用Charles工具查看PC本地IP和端口号(端口号默认为8888,也可自行修改),选择“Help->Local IP Address”

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

查看默认端口号“Proxy->Proxy Settings”

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

2)长按Android设备当前连接的WiFi,选择”Modify network”->”Advanced options”->“Proxy”->”Manual”,如下图所示,输入”Proxy hostname”和”Proxy port”(即上一步查看的IP地址和端口号)然后点击保存,见下图:

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

3)点击保存后,Charles会弹出connection确认弹窗,选择”Allow”,见下图:

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

4)注意,如果首次连接时,Charles未出现该提示,请手动进入Charles的设置选项,添加当前手机的IP,选择“Proxy->Access Control Settings”

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

点击“Add”手动添加IP

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

证书安装---

上述操作只是完成了代理配置的一半,想要Charles抓到包还需要在移动设备上安装证书。

1)手机浏览器访问链接
http://www.charlesproxy.com/getssl/(链接名字长,注意不要写错),也可以在Charles中查看下载证书的地址,见下图红框标注的位置

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

2)安装动态证书(证书名称随意填写即可),凭据用途默认即可,证书安装时需要设置系统锁,设置锁屏成功后证书会提示证书安装成功。到此,你的设备和Charles就建立了连接,可以尝试在设备上访问一个地址,在Charles左侧视图就能实时看到请求啦~但你会发现,有些请求为什么会显示成红叉unknown呢?请接着往下看~

【注】此步操作不成功的请下滑页面到底看【踩坑】部分。

HTTP(HTTPS)抓包,代理工具,程序员测试开发必会

当然charles是需要激活的,以后的文章,小编带来如何激活哦,记得关注下!!


分享到:


相關文章: