移动端调试是每一位前端工程师必须掌握的技能，在移动端环境上往往有很多不同的情况，我们需要借助一些工具来调试。本文将介绍 Mac 如何安装 charles，进行抓包、以及一些应用场景。
- 场景一：app端内线上环境接口报错，想看看请求数据是否有误
- 场景二：微信环境内调用微信支付等，需要验证域名（aaa.bbb.com）才能调试。改一行代码我就发布上去?好麻烦啊。
- 场景三：app端内H5，调用jsBridge，和端上通信，本地开发环境压根没有这些jsBridge方法，那我改一行代码我就发布上去？然后在端内调试？
常用调试工具
- eruda/vConsole Weinre、spy-debugger 等
- charles 抓包
下载charles
下载并且安装charles并且打开
Mac 代理
1. Mac上安装证书
安装完成后，我们只能抓取 http 的网址，想要抓 https 的包需要安装证书
点击 Help -- SSL Proxying -- Install Charles Root Certificate
2. 信任证书
安装成功后需要信任证书
3. 开启Mac OS proxy
4. 把需要代理到域名添加到 SSL Proxying
5. 抓 https包 成功
6. 抓包无法成功？
闭电脑上 其他 网络代理！！不关闭可能导致charles代理失败
安卓手机 代理
1. 开启工具
点击 Help -- SSL Proxying -- Install Charles Root Certificate on a Mobile Device or Remote Browser
2. 手机连接Wi-Fi配置网络代理
连接当前网段wifi，长按当前wifi-修改网络-高级设置-代理手动-输入ip地址和端口号
3. 在手机浏览器输入 chls.pro/ssl 下载证书
4. 安装证书
- 在手机系统设置中搜索凭据-点击加密和凭据
- 点击从存储设备中安装
- 选择刚刚在浏览器中下载的证书
5.把需要代理到域名添加到 SSL Proxying
和Mac 设置SSL Proxying 步骤一致，
如果嫌单独添加麻烦, Proxy —> SSL Proxying Settings 的配置地址，如果不想每个域名都设置一次，可以直接把 Host 和 Port 都设为 *，允许抓取所有域名的请求包
6. 至此安卓 抓包就可以成功了
手机上打开一个百度的链接，在charles的 structure 看看是否能抓到网络请求。
