IOS 客户端 H5调试方法

您所在的位置:网站首页 iosapp缓存 IOS 客户端 H5调试方法

IOS 客户端 H5调试方法

2023-06-16 12:23| 来源: 网络整理| 查看: 265

网上找到了两种IOS端的H5应用调试方法,都尝试并使用了一下。网上东西都比较杂乱,所以自己试过之后就总结了一下。

1.直接使用Safari浏览器进行调试

https://www.jianshu.com/p/126d02ae9c14 按照上面这个步骤就可以实现,但前一段时间自己在使用的时候会出现闪退的情况,不过最近突然又能够稳定使用,目前不知道是什么原因,很迷。有可能和当时设备的状态有关系。

2.使用Chrome浏览器进行调试

在网上看到两种方法都进行了尝试

(1)使用iOS-webkit-debug-proxy

https://blog.csdn.net/mcky_love/article/details/80847520

事实证明这种方法只能看到移动端H5页面的代码,不能实现和移动端的连调

(2)使用remotedebug-ios-webkit-adapter

能够实现调试效果,不过第一次使用需要用梯子,但是只有第一次才需要,以后有了缓存就不要了,除非你的缓存被清掉。 整理如下 (1)安装 remotedebug-ios-webkit-adapter 之前先要安装 ios-webkit-debug-proxy 和 libimobiledevice

brew update brew unlink libimobiledevice ios-webkit-debug-proxy usbmuxd brew uninstall --force libimobiledevice ios-webkit-debug-proxy usbmuxd brew install --HEAD usbmuxd brew install --HEAD libimobiledevice brew install --HEAD ios-webkit-debug-proxy

(2)安装remotedebug-ios-webkit-adapter

npm install remotedebug-ios-webkit-adapter -g

(3)手机同样需要开启 Web 检查器,USB 连接电脑 (4)启动 remotedebug_ios_webkit_adapter 或 remotedebug_ios_webkit_adapter --port=9000(默认是9000端口,你也可以自己指定端口)

image.png

(5)谷歌浏览器打开 chrome://inspect/#devices -> Configure -> 配置上一步指定的端口 localhost:9000 -> Done

image.png (6)配置完成之后就可以看到我们手机中打开的页面了,点 inspect 就可以进行调试了 image.png

使用chrome也会出现偶尔检测不到的情况或者比较卡的情况,这时候可能需要在命令行重启下remote debug-ios-webkit-adapter(反复尝试好多次发现每当想在resources中查看.js文件的时候就会断开连接,其他情况几乎没出现过链接断掉的情况)。调试界面是通常熟悉的Chrome调试界面。如果想在调试的页面打断调试,首先可以通过在页面中写console.log的方式在pc端定位到文件,直接在resources里面看是找不到的。 可参考 https://jingyan.baidu.com/article/ca41422f06418b1eae99edb5.html https://blog.csdn.net/sansan_7957/article/details/90641505

3.安装remote debug-ios-webkit-adapter时遇到的问题

a. brew非常慢

解决方案:换源

https://www.cnblogs.com/diaolanshan/p/10187763.html

https://www.jianshu.com/p/7cb05a2b39a5

b.安装libimobiledevice出现问题:onfigure: error: Package requirements (libusbmuxd >= 1.1.0) were not met:

https://blog.csdn.net/weixin_34061482/article/details/91123804

c.ERROR: Could not connect to lockdownd, error code -3 解决方案

https://blog.csdn.net/weixin_40598352/article/details/81512704

4.使用Safari和Chrome两种调试方法的体验

个人感觉,如果说你所使用的电脑没有出现闪退或者其他情形,使用Safari进行调试比较方便。如果Safari使用不了,可以使用Chrome的方式。当然,如果你更适应Chrome的调试界面的话,用Chrome应该会让你体验更好。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3