2021年了Charles为什么依然这么重要
Charles是一个HTTP代理服务器,HTTP监视器,反转代理服务器,当浏览器连接Charles的代理访问互联网时,Charles可以监控浏览器发送和接收的所有数据。它允许一个开发者查看所有连接互联网的HTTP通信,这些包括request, response和HTTP headers (包含cookies与caching信息)。
Charles有什么用呢
- 拦截/修改本地请求信息
- 拦截/修改请求响应信息
- 作为一个前端er就不需要找后端大大增加/修改测试数据啦
接下来我们来一起搭建一个Charles PC端/移动端环境
1、我们首先去官网下载 www.charlesproxy.com/download/
2、接下来根据自己安装的版本进行安装
3、打开软件后一定要选择 “grant” 进行授权(当然,选错了也没事,后面还有提示“grant”)
4、打开后界面如下
5.接下来进入最重要的环境搭建环节
找到菜单栏 Proxy -> Proxy Settings
可直接按照我图中勾选,也可按需勾选
6、接下来需要配置被代理的网址(我们需要抓取/修改信息的网站)
找到菜单栏 Proxy -> SSL Proxying Settings
如图中 Location即被代理的网站列表,include为包含,exclude为排除
add配置中可使用通配符“*”来配置host跟port,即全部代理
7、现在已经可以代理简单的http协议网站了。接下来我们来搭建https网站代理环境
在上述的步骤后
找到菜单栏 Help -> SSL Proxying -> install charles root certificate
接着mac电脑会打开钥匙串
点击“添加“输入密码即可,接着按下图配置
8、到目前位置,pc端代理已经完成。我们已经可以抓取并修改http/https的请求响应数据了。
9.接下来配置手机端环境
a、接着在手机浏览器输入chls.pro/ssl,会提示下载证书,选择下载
b、在设置-通用-描述文件与设备管理,选择下载的证书进行安装
c、信任证书:在 设置-通用-关于本机-证书信任设置
10、配置完成啦
接下来我们就可以随心所欲的抓取数据并修改啦(下面是一个简单的案例讲解)
接下来我们刷新页面,会自动跳转到下面的页面
修改完毕点击 -> Execute 发送请求
修改完毕点击 -> Execute 放行请求 然后我们就会再网站上看到我们修改过的信息啦