Accessing iOS Safari Web Inspector from Windows Machine

青春壹個敷衍的年華 提交于 2019-11-27 18:27:40

It appears to require Safari 6, which has not been released for Windows. Regarding the unavailability of Safari 6 on Windows, Apple has stated "Safari 6 is available for Mountain Lion and Lion. Safari 5 continues to be available for Windows."

I regularly use weinre. It basically runs a webserver that in turn acts as an inspector-enhanced proxy to browse webpages and websites. The inspector can be started by adding a script to your page or running a bookmarklet.

weinre is a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it's designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone.

To install it, you will need NodeJS and NPM (included with NodeJS). You will also need a WebKit-based browser on the desktop/receiver end (Safari, Google Chrome, or Chromium). It should work on Windows, OSX, and Linux.

If you already have NodeJS and NPM installed, you can install and run it with:

npm i -g weinre
weinre
# Go to the URL that it outputs for instructions to use it

UPDATE:

@EvAlex has pointed out another tool very similar to Weinre called Vorlon.js. It is pluggable and supports viewing/switching between the inspector of multiple devices simultaneously.

Setup Vorlon on Windows

npm i -g vorlon
vorlon

Verify Vorlon is Running

Open a web browser and navigate to http://localhost:1337

Setup Ngrok

  • Download Ngrok: https://ngrok.com/download
  • Unzip it
  • Open a command prompt: Start -> Search -> cmd
  • Navigate to ngrok.exe: cd <ngrok_path_where_ngrok.exe is stored>/
  • Run it: ngrok.exe http <port> e.g. ngrok.exe http 1337

Ngrok provides a url e.g. https://0ad8c32f.ngrok.io -> localhost:1337

Copy and paste the ngrok url into your webpage.

<script src="https://0ad8c32f.ngrok.io/vorlon.js"></script>

Navigate to the page under test on your device(s):

http://thepageiwanttotest.com/testing123

References

Stumbled upon this blog which shows how to debug iOS web app on Windows using a stndalone app by Telerik called AppBuilder. You're supposed to create an account on their platform before using it and it has a 30 day trial.

I've used this on windows 7 64 bit for both vanilla web apps and Phonegap apps both on iPad with iOS 7.1, and it works. You get web development tools very similar to those in Chrome.

I have found a great tool called GapDebug

that's was the right solution for me :)

Harvey Mushman

After trying to get Weinre installed on my Windows 10 machine which is running IIS and a localhost client and never being able to get it to work, I looked for an alternate solution.

Turns out Safari for Windows was discontinued by Apple but I was able to fine a copy after discovering the following link. Oh, the Web Inspector in Safari was able to help me find the problem in my application once it was installed.

https://apple.stackexchange.com/questions/68836/where-can-i-download-safari-for-windows

Once Safari was installed, I needed to turn on the developer tools. This required going into Preferences > Advanced > check "Show Develop menu in menu bar" > (click on page icon next to sprocket icon hover over Develop) Start Debugging in JavaScript. From here on it felt very much like Chrome...:-)

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!