Mac 上使用 Charles 抓包进行网络分析

近期想给 Chrome 编写一个关于 Github 插件,有一个地方通过 Github 现有的 API 不知道如何快速方便地拿到我需要的数据,但 OhMyStar 2 上可能会有相关的操作,我就想着去借鉴一下它是如何实现的,于是需要用到抓包工具,网上搜索了一下,选择 Charles 这个工具。

一、安装 Charles

Charles 是收费的,一个用户是 30 刀,但可以免费试用 30 天。

Mac 上可以通过 Homebrew 来安装:

brew install charles

但这种方式因为网络的原因非常慢,我尝试用 Aria 2 下载也不行,所以最后还是选择了去官网找到下载链接后用迅雷搞定。

安装完成后打开,会显示如下界面,Charles 这个 APP 需要你授权于它来自动配置一些网络相关的设置,这个授权只会请求一次,点击 Grant Privileges 授权:

请求授权

授权成功后会来到这样的一个界面:

Charles 界面

界面比较简洁,第一排是一些相关操作的按钮,鼠标放上去会有相关的英文提示。左边会显示出当前 Charles 监听到的网络请求,右边显示请求的一些具体信息。

在使用 Charles 之前,需要把网络代理软件关掉。

二、设置

Charles 默认无法抓取 HTTPS 协议的网络请求,需要通过一定的配置。

通过在菜单栏选择 Help -> SSL Proxying -> Install Charles Root Certificate,会自动导入 Charles Proxy CA 证书并打开 Keychain Access,双击新导入的证书弹出证书信息页面,将 Secure Sockets Layer(SSL) 设置为 Always Trust,关闭页面后弹出密码提示,输入密码更新系统信任设置。

安装 Charles 根证书

信任 Charles 的根证书

在菜单栏选择 Proxy -> SSL Proxy Settings...,在 SSL Proxying 选项卡中可以添加需要抓包的域名端口,我这里偷懒直接设置成了抓取所有域名的 443 端口。

添加 SSL 抓包设置

三、抓 OhMyStar 2 的包

因为我之前并没有关闭飞机,所以我关闭飞机后重新启动了 Charles,然后打开 OhMyStar 2 以后在 Charles 的界面上点击第一排的红色按钮停止抓包(因为我之前偷懒设置了抓取所有 HTTPS 请求,如果不停止的话左侧会显示很多内容导致非常乱)。

然后找到了相关的 API 请求,并从中获取到了我想要的答案。

抓取到的请求


 上一篇
The Fucking Github The Fucking Github
The Fucking Github 是一个 Chrome 浏览器的扩展插件,可以用来很方便地查看、整理、搜索你已经 Star 过的项目和搜索 Github 上的项目。 能干啥你是否在 Github 上有很多 star 过的项目并且经常需
2019-04-14
下一篇 
Hexo 部署到个人服务器 Hexo 部署到个人服务器
我身为一名后端的 Web 开发人员,在有了一定的技术能力之后一直想亲手打造一个自己的博客。 在折腾了很久之后终于意识到简单、简洁、够用就好,于是物色了 Hexo 这个静态博客框架,打算部署到自己的服务器上,遂有此文。 配置远程服务器我的远程
2019-01-01
  目录