MAC上Chrome网页使用Charles抓包

背景

Leader提了个需求，想把一个指定页面的数据进行Mock造数据改写，模拟某种业务场景。由于工作中主要是Android客户端开发，对网页如何抓包，如何Mock造数据还是“大姑娘坐轿，头一回”。想到Android开发时使用比较多的抓包工具是Charles，于是就想是否Chrome网页也可以使用Charles抓包，和前端开发同学咨询后确认使用Charles抓包是可行的。

下面就介绍下整个抓包过程及踩过的坑，期望对你有用。

安装Charles

如果已安装Charles，则跳过。

还没有安装Charles，网上很多资料，请自行百度进行安装。

开始抓包

1.Proxy菜单选择macOS Proxy

2.选择想要抓包的接口，通过Tools菜单的Map Local设置Mock数据

3.完成Mock过程

踩过的坑

1.报错CROS error，应该是跨域问题导致的。

解决方法参考：

charles 本地代理（map local）接口数据产生的跨域问题解决办法