有些测试场景需要知道在真实实体手机上访问我们开发的页面时产生了哪些不同的请求、访问了哪些链接。这个事情在 Windows 上做起来很简单,工具也有很多。浏览器自带的监控工具、HttpWatch 等工具都可以实现,今天介绍的主角 charles-proxy 也可以实现,但是 charles-proxy 强大的地方在于它可以建立一个临时代理服务器,手机上设置使用这个代理即可在 charles-proxy 中查看所有的浏览记录。
打开 https://www.charlesproxy.com/ 下载最新版本的 charles-proxy 并安装。安装完成后打开,默认情况下它会监控我们 Windows 本机的访问记录。
接下来我们来配置一下代理,让我们的 iPhone 来连接。点击 Proxy->Proxy Setting 菜单:
在打开的窗口中,勾选 Enable transparent HTTP proxying 复选框,端口我们设置为默认的 8888。然后点击 OK 按钮。
此时就已经开启了代理,你需要看一下你的 IP 地址,好让 iPhone 来连接。
打开 iPhone,将网络和你电脑连接到一个内网中,在 WIFI 设置中,点击 WIFI 名字右侧的叹号,进入设置页面并点击最下方的代理设置。
修改为手动配置,输入你电脑的 IP 地址和端口号 8888
此时就已经配置好了,当你确定设置并返回的时候,你会看到 Charles 的窗口弹出了一个提示框,提示你是否允许这个连接。
这里点击允许就可以了,然后你手机访问网页时,这里就可以监控到具体的访问轨迹了。