使用浏览器配合手机调试&使用Proxy劫持（3类真机调试技巧）

你好，我是终身学习的阿飞。

我做了个青柠檬读书会的公众号，每天分享我的学习、读书的内容，同时也会分享我的一些学习方式和一些软件推荐。

如果您有任何问题，可以在博客下方留言，我们一起探讨。

有兴趣可以关注，我们一起进步！

---

方式一： Chrome + Android OR Safari + ios

safari + ios

• 在Mac端safari中调试vue网页

• 在iphone手机中，设置 - 高级 - 打开web检查器

• 通过ifconfig（ipconfig）查看本机的IP

• 用safari 访问这个ip：端口之后，就可以在电脑上打开调试器了。

Chrome + Android

• chrome浏览器进入这个地址：chrome的地址chrome://inspect/#device

• 手机端开启开发者模式：多次点击版本号
  • 打开开发者模式
  • 打开USB调试

• 手机端访问需要调试的地址：
  • 保持在同一个网段
  • 用数据线连接电脑

[Tip]如果出现白屏，请检查浏览器的版本。

方式二： Fiddler OR Charles

当我们的服务已经发布到线上了，而这个页面是嵌套在App中的，需要访问接口，页面上一直在加载中。

这个时候就需要使用劫持工具了。

以Charles为例子

• charles的设置如下：

• 手机端设置如下：

手机访问任何地址的时候，都会弹出这个界面，点击allow