在Windows笔记本上调试运行在iOS设备上的前端应用-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

在Windows笔记本上调试运行在iOS设备上的前端应用

简介:

我在每天工作中需要在不同的移动设备上测试我们开发的前端应用是否正常工作,比如iOS设备和Android设备。我用的工作笔记本电脑又是Lenovo的,安装的是Windows操作系统。

有的时候一个开发好的前端应用,在Android设备上正常工作,但是在iOS平板上测试却发现问题(相当广大前端开发者都曾经遇到过类似问题)。顺手就想调试一下找到原因。那么一个前端应用运行在iOS设备上,程序员如何在安装了Windows系统的笔记本上进行调试呢?

假设我的前端应用是这个url:https://jerrylist.cfapps.eu10.hana.ondemand.com/ui5/

在IPAD上打开界面如下:

1. 在Windows笔记本电脑上安装iTunes: https://www.apple.com/cn/itunes/download/

安装后,您的Windows笔记本电脑才能成功和iOS设备连接并成功识别它。

2. 到iOS设备上,菜单iPad->Settings->Safari->Advanced,打开“Web Inspector” 选项。

3. 从github网站下载ios-webkit-debug-proxy-win32:

https://github.com/artygus/ios-webkit-debug-proxy-win32

将zip解压到一个文件夹里,然后把这个文件夹加到Path环境变量里。

4. 在Windows系统的CMD里,敲入下面的命令行:

ios_webkit_debug_proxy.exe -f chrome-devtools://devtools/bundled/inspector.html

收到Windows成功监听iOS设备事件的消息:

Listing devices on: 9221

Connected: 9222 to Jerry's iPad

在浏览器里访问:http://localhost:9221

从结果列表里就看到我的iOS设备了。

点localhost:9222的超链接,然后就可以看到另一个超链接,代表了我的IPad的Safari当前打开的网页:

点这个超链接,Windows笔记本电脑上的Chrome开发者工具就自动打开了。在IPad上会弹出一个询问您是否允许调试的对话框。点“Approve”按钮,就可以开始在Windows电脑上调试远端连接的iOS设备上的前端应用啦!

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章
最新文章
相关文章