webpack 开启本地服务,host 设置 0.0.0.0 端口最好是80(mac 开启本地服务需要加sudo使用80端口)
Charles 设置 proxy 端口(默认8888) 设置DNS Spoofing 把需要的域名如: m.baidu.com指向0.0.0.0
手机 wifi 设置代理 电脑ip:8888
完成, app H5 页面的m.baidu.com的服务就是电脑webpack 的服务
调试工具:
android 可以通过 chrome devtool 调试,usb 连接手机, devtool 找到 remote devices
ios 电脑safari devtool, 手机safari 开启 web inspector, mac 打开 safari 调试
ios safari 通过 chrome 调试的方法 https://github.com/RemoteDebug/remotedebug-ios-webkit-adapter
2 charles 设置代理
ios safari 输入localhost 不能被转发 可以输入 localhost. 或 http://localhost.charlesproxy.com/ 代替localhost
3 通过 手机 浏览器 访问本地服务器
1 在您的开发计算机与 Android 设备之间设置远程调试。 完成后,您应在 Inspect Devices 对话框的左侧菜单中看到 Android 设备,还应看到 Connected 状态指示器。
2 在 DevTools 的 Inspect Devices 对话框中,启用 Port forwarding。
3 在左侧的 Device port 文本字段中,输入 Android 设备上您想要从其访问网站的 localhost 端口号。例如,如果您想要从 localhost:5000 访问网站,则应输入 5000。
4 在右侧的 Local address 文本字段中,输入开发计算机网络服务器上运行的您的网站的 IP 地址或主机名,后面紧跟端口号。例如,如果您的网站在 localhost:7331 上运行,则应输入 localhost:7331。
5 可以device port 可以和服务器端口一样,这样可以解决一些问题端口不同问题
https://developers.google.com/web/tools/chrome-devtools/remote-debugging/local-server#port-forwarding