一 、使用Charles实现本地数据mock方法
- 1.安装Charles 教程请看 https://www.jianshu.com/p/543ad8ef3ceb
- 2.打开Charles
到菜单 Tool ——> Map Local Setting里设置 -
3.设置完成后点击OK
Map Local Setting1
Map Local Setting2
Map Local Setting3
至此，mock设置成功，在代码中编写请求数据的方法
componentDidMount() {
axios.get('/api/abc')
.then(()=>{
alert('succ')
})
.catch(()=>{
alert('error')
})
}
到页面command + R 刷新，查看请求结果
二、404问题解决
这里给出几种方案供参考
- 1 将上面的Map Local Settings 中填写的
localhost更换成localhost.charlesproxy.com
localhost.charlesproxy.com1
localhost.charlesproxy.com2
同时网页端请求接口也更换成 localhost.charlesproxy.com:3000 注意冒号是英文冒号，刷新重试，如果还是不成功，试试下面的方法
- 2 将上面的Map Local Settings 中填写的
localhost更换成自己网络的ip，本机ip获取方法，打开Charles，菜单栏选择help ——> Local IP Address
ip1
ip2
更换后
ip3
同时在网页的地址中也要更改成你的 ip+:3000， 例如
192.168.30.223:3000，重新 command + R 刷新
- 3 如果还不成功，查看Charles配置
-
① 查看菜单栏 Proxy ——> macOS Proxy 是否勾选，未勾选点击勾选
-
-
② 查看Charles证书是否受信任
打开证书方式，菜单栏 Help ——> SSL Proxying ——> Install Charles Root Certificate 打开钥匙串，双击Charles的证书
信任1
信任2
重启Charles 再次刷新网页，查看是否成功
以上，如果还是不能解决问题，请百度搜索其他方法，或者找大牛帮忙！！！
