如何用chromedevtools调试iossafari

author author     2023-05-13     148

关键词:

1、在Android手机上安装Chrome(ChromeforAndroid)应用超市、或者google官网即可下载。2、电脑系统安装了最新版的Chrome最新版Chrome,确保开发者工具正常使用3、Android手机装了USB驱动在设备管理器查看是否正确安装了驱动,如无,则需要到手机的官网下载,例如:小米1S的驱动一、安装AndroidSDK下载AndroidSDK,,本人的机器是windows,下载的文件为adt-bundle-windows-x86,解压并释放到D:/soft/android/adt(你也可以选择其他路径)二、允许Android手机启用USB调试1、android系统设置:“设置”》“开发人员选项”》“USB调试”;2、手机上Chrome浏览器设置:打开Chrome浏览器,点击左下角菜单按键,“设置”》“开发者工具”》“启用USB网页调试”三、运行AndroidSDK1、设置环境变量:右击“我的电脑”》“属性”》“高级”》“环境变量”》编辑“PATH”变量值,在末尾添加“;D:softandroidadtsdkplatform-tools”2、运行adb打开cmd,输入如下命令:adbforwardtcp:9222localabstract:chrome_devtools_remote四、调试1、在手机上用Chrome打开需要调试的网站2、在电脑上用Chrome打开,3、调试点击需要调试的网站,熟悉的DeveloperTools就出来了,至此,利用Chrome在android手机上调试网站的方法告一段落。 参考技术A 安装 iTunes
Windows 系统首先要安装 iTunes ,打开 Apple 官网下载 iTunes 并完成 iTunes 安装,否则计算机无法正确识别 iPhone 设备。
开启调试模式
要远程调试 IOS Safari ,必须启用 Web 检查 功能,打开 iPhone 依次进入 设置 > Safari > 高级 > Web 检查 > 启用。
ios-webkit-debug-proxy
ios-webkit-debug-proxy 是一个 DevTools proxy ,项目托管在 Github 上。其使得开发者可以发送命令到真实(或虚拟)IOS设备中的 Safari 浏览器或 UIWebViews 。
安装部署
项目地址:https://github.com/artygus/ios-webkit-debug-proxy-win32。
在 Binaries 小节点击下载链接。
下载后完成解压缩,将ios-webkit-debug-proxy-win32 目录复制到 C:\ 盘。
在系统环境变量添加 C:\ios-webkit-debug-proxy-win32。
启动 proxy
打开命令行终端,执行:
ios_webkit_debug_proxy-win32.exe -f chrome-devtools://devtools/bundled/inspector.html

输出结果如下:
ios_webkit_debug_proxy-win32.exe -f chrome-devtools://devtools/bundled/inspector.html
Listing devices on :9221
Connected :9222 to iPhone (c356a29f73043a36aa6de64b088d55aeeda8f034)
开始调试
打开 chrome 浏览器,在地址栏输入 http://localhost:9221/ ,这里会显示所有已连接的设备清单,选择一个设备并点击打开。
打开的页面可看到当前 iphone 中 Safari 浏览器打开的所有页面,点击要调试的页面链接打开即可进入调试界面。此时可能会有一个错误提示如下
Note: Your browser may block1,2 the above links with JavaScript console error:
Not allowed to load local resource: chrome-devtools://...To open a link: right-click on the link (control-click on Mac), 'Copy Link Address', and paste it into address bar.

提示浏览器禁止页面加载本地资源,需在上面的链接上点击右键复制链接,然后手动新建一个标签页将链接粘贴进去,回车访问。
根据提示说明复制链接并打开,即可看到常见的 chrome 调试窗口。
接下来,就可以进行正常的调试工作了。

如何用vscode调试webpack

参考技术A打开vscode,从命令行打开预先定义的文件夹,如:e:\netcore\demo;使用快键键调出命令行窗口,ctrl+`;其实这里有两种方式,直接通过windows命令行也是一样的。前提是安装了.netcoresdk. 查看详情

如何用本地脚本替换某些javascript引用的内容进行调试?

】如何用本地脚本替换某些javascript引用的内容进行调试?【英文标题】:Howtosubstituteacontentofcertainjavascriptreferencewithlocalscriptfordebugging?【发布时间】:2011-03-1205:39:01【问题描述】:我需要调试页面加载的jasvascript。加载的页面不... 查看详情

如何使用chromedevtool调试mobile网页?

...页webapp开发的朋友一定对开发效率的底下会有吐槽。现在chromedevtool改变了程序员们的苦比。1.chrome://inspect/#devices2.android手机中打开chromeandroid3.usb连机4.在pc的chromedevtool中inspect即可!https://www.html5rocks.com/en/tutorials/devel 查看详情

如何用vs进行程序调试

VS是一个强大的IDE,如果你现在只会简单地用它查看一下执行效果,那就太大材小用了。1.CRT函数报错首先来说说最常见的一个编译错误。微信里常常收到这个错误的截图提问。CRT(CRuntimeLibrary=C运行时间库)是windows平台下的一个概... 查看详情

如何用windbg调试因需加载的dll

参考技术A点击文件就可,如果不能运行1、打开电脑管家找到工具箱;2、打开工具箱找到“电脑诊所”3、打开电脑诊所后在右上角的搜索内输入dlL找到需要修复的文件后点击一键修复或者可以点击详情查看原因并点击立即修复... 查看详情

20个chromedevtools调试技巧(代码片段)

译者按: ChromeDevTools很强大,甚至可以替代IDE了!原文: ArtofdebuggingwithChromeDevTools为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。谷歌开发者工具提供了一系列的功能来帮助开... 查看详情

如何用android studio进行无线的真机调试

参考技术A用AndroidStudio进行无线的真机调试的设置方法;1、连接手机,手机开启adb。步骤:设置>应用程序>开发>选择USB调试:2、Androidstudio中设置使用手机而不是模拟器。3、按SHIFT+F10,运行程序。开始正式在真机运行。 查看详情

如何用react导入echarts

参考技术A首先使用reactnative编写一个简单的应用,在碰到问题的时候,肯定需要对代码进行调试。目前reactnative支持在Chrome浏览器内进行调试。需要选择Scheme->Run的选项为Debug,否则模拟器中不会出现调试选项。将应用设置为在... 查看详情

如何用androidstudio进行无线的真机调试

1,在真机中设置USB调试模式打开,具体:“设置”->“应用程序”->“开发”->“USB调试”。2,安装安卓的USB驱动,如果按照不好,那么去下载一个豌豆荚,它会帮你正确安装你的手机驱动。下载地址:http://www.wandoujia.com/... 查看详情

如何用cmd打开tornadovxsim进行仿真调试

由于特殊需求,需要使用命令行的方式来使用vxsim仿真1、首先需要添加Tornado2.2环境变量WIND_BASE=C:Tornado2.2WIND_HOST_TYPE=x86-win32WIND_UID=em   //注意,这里的em.是根据你电脑的完整计算机名确定的。我的电脑计算机名是em追加... 查看详情

chromedevtools怎么打开

ChromeDevTools是Chrome浏览器自带的一个调试工具,在浏览器里面按下F12键或者在设置-更多工具里面就能找到它。这个工具主要是给前端工程师调试页面用的,但是我们也可以利用它来做一些和开发无关的事情参考技术A更多工具-开... 查看详情

如何用pycharm来调试odoo

可以用pycharm来调试odooserver,只需要配置一个本地的debugger即可。如果odooserver采用配置文件,在debugger文件中配置参数,例如:-c/path/to/odoo_config.conf.笔者在用pycharm调试odooserver的时候,发现一个奇怪的问题,当采用debug模式启动odoos... 查看详情

如何用modbusslave调试组态王的通讯功能?(或者是串口助手)

想大概的知道组态王的通讯功能,自己测试一下,可是不知道怎么连上的,我已经虚拟了一对串口:com5-com6可是在组态王中不知道是怎么编程的。很奇怪。参考技术A你的是西门子200里面的ModbusSALVE,这个东西很简单,MODBUS你首先... 查看详情

如何用好androidstudio的logcat

参考技术Alogcat就是程序输出的日志Android开发调试时logcat不显示问题,网上很多解决方法,但是很多将log级别的,用法的,更多的是如何在logcat中设置filter进行log的过滤与查看,但是我遇到的问题是,模拟器怎么着都OK,但真机、... 查看详情

c#vs2005在win7下如何用管理员身份调试程序

怎么样在win7下用管理员身份调试程序呢?我用的vs2005,和vs2008。由于程序中有对注册表的修改,只有管理员身份才能执行,所以无法调试,只能打开debug文件夹直接执行。如何解决?你先检查一下你的用户是不是在ADMINISERATOR组... 查看详情

如何利用chromedevtools调试android手机上的web网站

参考技术A利用ChromedevTools调试android手机上的web网站方法:操作之前先准备好以下步骤:1、在Android手机上安装Chrome( ChromeforAndroid )2、电脑系统安装了最新版的Chrome 3、Android手机装了USB驱动一、安装AndroidSDK下载Android... 查看详情

如何用adb连接android手机

第一步:手机连接电脑第二部:找到手机的开发者选项把USB调试打开(不同手机USB调试的打开方式不一样)第三部:安装驱动(PS:正常这三步就可以了,有的手机需要下载鲁大师,或者是豌豆荚等来链接手机,,个人经验请多指... 查看详情

如何用visualstudiocode调试javascript

参考技术Avscode使用task.json来配置项目的构建过程。打开命令面板(Ctrl+Shift+P)选择RunBuildTask(Ctrl+Shift+B)如果当前工作空间没有task.json配置文件此时会出现提示选择ConfigureTaskRunner自动创建task.json。该配置文件在工作空间的.vscode目录... 查看详情