Safari/Chrome调试WebView
source link: http://www.cocoachina.com/ios/20181122/25552.html?amp%3Butm_medium=referral
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
前言
最近在写《iOS代码调试》系列的博客,估计会有十篇以上的内容,等到都写完了会在Github以一个仓库的形式开源出来,欢迎关注我的Github:
WebView
大多数App会选择H5去实现某些弱交互但是却需要热更新界面,这时候WebView就派上用场了,那么如何对WebView进行调试呢?
Safari
开启开发菜单
Safari -> 偏好设置
勾选“在菜单栏显示开发菜单”
设备的Safari调试
设置 -> Safari -> 高级 - > 开启Web检查器
选择要调试的网页
在App内打开对应的Webview
状态栏点击开发 -> 选择设备 -> 选择网页
然后,就可以通过safari调试这个网页了
对于iOS原生开发来说,用的做多的还是终端,比如你要测试一个WKWebView的JSBridge
window.webkit.messageHandlers.bridgeName.postMessage({//data..})
或者测试一个scheme
window.location.herf="xxxxx"
建议iOS开发者学习一些JS的基本知识,这会对调试WebView大有帮助。
Chrome调试
Chrome调试比较适合写H5的同学,因为在这里可以使用类似React/Redux等插件来提高效率。
准备工作:
开启iOS设备中Safari设置的WebContent检查器
确保手机被系统信任
brew install ios-webkit-debug-proxy
安装: remotedebug-ios-webkit-adapter
npm install remotedebug-ios-webkit-adapter -g
运行adapter:
remotedebug_ios_webkit_adapter --port=9000
接着,在App中打开包含WebView的应用,然后chrome打开如下地址
chrome://inspect/#devices
点击config
添加 localhost:9000
然后,就能够看到刚刚应用中的WebView了
点击inspect,就可以用Chrome进行调试了:
---------------------
作者:黄文臣
原文:https://blog.csdn.net/Hello_Hwc/article/details/80721246
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK