今天早上在微信公众号中看到《9102 了,你还不会移动端真机调试?》这篇文章。顿时就像在沙漠中看到了一片森林一样的感觉。因为之前做过手机端的网页和微信公众号的东西,因为手机上没有控制台,样式什么的调整不了,打印出来的东西不能看到,只能借助alert()来调试。这篇文章真的是给我送来了一泓清水。
by 2019.03.29
若只是单纯的看效果有两种方法
1.使用本机ip+端口号来访问网页
2.使用草料网https://cli.im/, 需要保持在同个局域网下,使用相同的wifi(这种方法在第一种方法下显得有点鸡肋)
接下来正式介绍spy-debugger
一.安装:
npm install –g spy-debugger
二.启动:
spy-debugger
三.设置手机的HTTP代理:
Android设置步骤:设置 - WLAN - 长按选中网络(电脑所连的wifi) - 修改网络 - 高级 - 代理设置 - 手动。
代理的地址为PC的IP地址,代理的端口为spy-debugger的启动端口,默认端口是 9888。 如果要指定端口:spy-debugger–p8888
。 手机安装证书(node-mitmproxy CA根证书):
四.使用
在电脑端将要调试的项目跑起来。然后使用手机浏览器打开ip+端口号。在http://127.0.0.1:50686/ 就可以看到手机浏览器打开的页面,进而进行调试。