一、环境

PC chrome浏览器(版本45、46)

IOS safari浏览器(11.2.6)

win系统(win7、win10)

一根USB数据线

二、打开iphone上 Safari浏览器的web检查器

设置 --> Safart浏览器 ---> 高级--- > 打开Web检查器

edbcc6d2c7172b3ac92a4142d19e59e6.png

三、windows上安装iTunes

下载地址:iTunes

四、windows上安装ios-webkit-debug-proxy

1.打开powerShell,一般windows10自带,无需安装

在搜索框内输入powerShell选择如下应用即可

b513e734bdf1a98ecfba3a57b5f18c5f.png

2.安装ios_webkit_debug_proxy

2.1 安装scoop(一个安装工具),在powershell应用中运行如下命令

2.1.1    set-executionpolicy unrestricted -s cu            //修改执行策略,选择是

2.1.2    iex (new-object net.webclient).downloadstring('https://get.scoop.sh')         //安装scoop

运行结果如下:

90359c5a4ed9224221a746ee512db80d.png

2.2 安装ios_webkit_debug_proxy,在powershell应用中运行如下命令

2.2.1    scoop bucket add extras

2.2.2    scoop install ios-webkit-debug-proxy

运行结果如下:

6a9e1d97c07eb4668bdfd3873ce275cb.png

3.添加设备端口

在chrome://inspect/#devices添加设备端口,在红圈处进行添加。

017238f17ac21fc7ee92c4423ac01e02.png

5f5038c1930af5a882dd35013340ebb1.png

4. windows上下载ios-webkit-debug-proxy-1.8-win64-bin.zip包

下载地址:ios-webkit-debug-proxy-1.8-win64-bin.zip

五、运行

1.解压ios-webkit-debug-proxy-1.8-win64-bin.zip,进入解压后目录,输入cmd进入命令,输入下面的指令

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

72d97e472ae6a92741f62024f38b1a36.png

2.USB数据线连接电脑和手机,在windows上打开iTunes,如下表示链接成功

56c2b58becf1fc45621fef017f3a7574.png

3.手机上打开一个地址:例如百度

22e56570bcb364b2d367cfcdfead85c2.png

4.打开127.0.0.1:9221,即可看到链接上的设备

28bc00de1711b5932b5e2f4539923401.png

5.然后点击127.0.0.1:9222跳转到下面的页面,右键单击------选择------>复制链接地址

da65b71782b89b926e0205555ad5b07f.png

将复制的地址粘贴到chrome的新窗口中即可

489b23b93ff5d9cfee55d87843fd1f55.png