前端移动端调试技巧

常用利器

1. vConsole
2. Charles
3. Mac + Ios + Safari
4. Chrome + android
5. weinre 微信 web 开发者工具

该篇文章只介绍前三种的使用方法哦～

vConsole

腾讯出品的 web 调试面板，主要有Console、Network、存储 等功能。
下载链接：https://www.bootcdn.cn/vConsole/

image.png

Charles

抓包工具，可以监听浏览器、手机发送/接收的所有数据请求。
面板包含 request, response 和 HTTP headers （包含cookies与caching信息）。
下载链接：https://www.charlesproxy.com/download/
破解（注册码）：https://www.cnblogs.com/nicece/p/10019872.html

image.png

Mac + Ios + Safari

iphone 手机插上数据线+Mac safari 调试
流程：手机-Safari浏览器-高级-web检查器 mac safari 打开，选择开发，打开手机访问的页面
注意：只能调试手机safari访问的页面记录，其他端不行

image.png