在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的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
Gradle 使用技巧(四) - 如何定位和解决依赖冲突
1. 前言 随着业务的复杂度加深,我们免不了要引入许多的第三方开源库,也不可避免的会出现依赖冲突的错误。最常见的是V7、V4包之间的冲突。 2. 如何定位依赖冲突 解决依赖冲突很简单,难得是如何去定位是引入的哪个库导致的依赖冲突。 如果只想看结果的可以直接跳到最后。 2.1. 排除法 排除法很简单,但是很耗时,就是选择一个依赖一个依赖的注释、编译、看结果。当然这也是最傻的办法,我们开发者怎么能做这种繁琐的工作呢?(说得我好像我自己没做过似的。。 滑稽 ) 2.2. Gradle Task Android Studio虽然给我们提供了一个依赖树,但也只是一个总的平面图,并不是十分的直观。 Android Studio依赖树 External Libraries只给我们提供了一个依赖结果,并没有指出是哪个依赖依赖了什么东西。 所幸,Gradle提供了一个task:androidDependencies,这个task能在命令行中显示依赖树之间的依赖关系。 找到androidDependencies task,每一个module下面都有相应的androidDependencies。 task位...
- 下一篇
3-SII--Android的SD卡文件读写
零、前言 [1]读写SD卡需要运行时权限。 [2]如果对运行时权限不清楚的童鞋,可以看一下我的封装:TI--安卓运行时权限完美封装 一、使用:SD卡文件读写 FileHelper fileHelper = FileHelper.get(); //在SD卡追加模式创建:data/writeFile2SD.txt文件,写入"toly" fileHelper.writeFile2SD("data/writeFile2SD.txt", "toly", true); //在SD卡上创建一个空文件 fileHelper.createFile("create/create.txt"); //读取data/writeFile2SD.txt文件 String read = fileHelper.readFromSD("data/writeFile2SD.txt"); System.out.println(read);//tolytolytolytolytolytoly 二、创建文件 判断是否存在SD卡 /** * 判断是否存在SD卡 * * @return 是否存在SD卡 */ private bool...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- Springboot2将连接池hikari替换为druid,体验最强大的数据库连接池
- SpringBoot2更换Tomcat为Jetty,小型站点的福音
- Docker安装Oracle12C,快速搭建Oracle学习环境
- CentOS7编译安装Gcc9.2.0,解决mysql等软件编译问题
- CentOS6,CentOS7官方镜像安装Oracle11G
- CentOS关闭SELinux安全模块
- CentOS7设置SWAP分区,小内存服务器的救世主
- CentOS7,CentOS8安装Elasticsearch6.8.6
- CentOS7编译安装Cmake3.16.3,解决mysql等软件编译问题
- Jdk安装(Linux,MacOS,Windows),包含三大操作系统的最全安装