IT이야기

Windows 시스템에서 iOS Safari Web Inspector에 액세스

cyworld 2021. 10. 8. 21:08
반응형

Windows 시스템에서 iOS Safari Web Inspector에 액세스


새로운 iOS 6 Safari에는 USB 케이블을 통해 데스크탑 Safari에서 연결할 수 있는 Web Inspector 기능이 있습니다. 그런 다음 데스크탑에서 iOS Safari에서 열린 페이지를 디버그할 수 있습니다. 하지만 내가 아는 한 이 기능은 현재 Windows가 아닌 Mac Safari에서만 지원됩니까? 내 말이 맞습니까, 아니면 Windows Safari에도 가능성이 있습니까? 아니면 나중에 사용할 수 있게 될까요?


Windows용으로 출시되지 않은 Safari 6이 필요한 것으로 보입니다. Windows에서 Safari 6을 사용할 수 없는 것과 관련하여 Apple은 "Safari 6은 Mountain Lion 및 Lion에서 사용할 수 있습니다. Safari 5는 Windows에서 계속 사용할 수 있습니다."라고 말했습니다.


나는 정기적으로 사용 weinre합니다. 기본적으로 웹 서버를 실행하여 웹 페이지와 웹 사이트를 탐색하는 검사기 강화 프록시 역할을 합니다. 인스펙터는 페이지에 스크립트를 추가하거나 북마크릿을 실행하여 시작할 수 있습니다.

weinre는 원격으로 작동하도록 설계된 것을 제외하고 FireBug(FireFox용) 및 Web Inspector(WebKit 기반 브라우저용)와 같은 웹 페이지용 디버거이며 특히 전화와 같은 모바일 장치에서 웹 페이지를 디버그할 수 있도록 합니다. .

설치하려면 NodeJS와 NPM(NodeJS에 포함)이 필요합니다. 또한 데스크탑/수신기 측(Safari, Google Chrome 또는 Chromium)에 WebKit 기반 브라우저가 필요합니다. Windows, OSX 및 Linux에서 작동해야 합니다.

NodeJS와 NPM이 이미 설치되어 있는 경우 다음을 사용하여 설치하고 실행할 수 있습니다.

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

weinre의 작동을 보여주는 개발자 도구 및 ios 시뮬레이터의 스크린샷

업데이트:

@EvAlex는 Vorlon.js라는 Weinre 와 매우 유사한 또 다른 도구를 지적했습니다 . 플러그 가능하며 동시에 여러 장치의 검사자 사이에서 보기/전환을 지원합니다.


Windows에서 Vorlon 설정

npm i -g vorlon
vorlon

Vorlon이 실행 중인지 확인

웹 브라우저를 열고 http://localhost:1337로 이동합니다 .

Ngrok 설정

  • Ngrok 다운로드: https://ngrok.com/download
  • 압축을 푼다
  • 명령 프롬프트를 엽니다. Start -> Search -> cmd
  • ngrok.exe로 이동합니다. cd <ngrok_path_where_ngrok.exe is stored>/
  • 실행: ngrok.exe http <port>ngrok.exe http 1337

Ngrok은 예를 들어 URL을 제공합니다. https://0ad8c32f.ngrok.io -> localhost:1337

ngrok URL을 복사하여 웹페이지에 붙여넣습니다.

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

기기에서 테스트 중인 페이지로 이동합니다.

http://thepageiwanttotest.com/testing123

참고문헌


AppBuilder라는 Telerik의 stndalone 앱을 사용하여 Windows에서 iOS 웹 앱을 디버그하는 방법을 보여주는 이 블로그 우연히 발견했습니다. 사용하기 전에 플랫폼에서 계정을 만들어야 하며 30일 평가판이 있습니다.

iOS 7.1이 설치된 iPad의 바닐라 웹 앱과 Phonegap 앱 모두에 대해 Windows 7 64비트에서 이것을 사용했으며 작동합니다. Chrome과 매우 유사한 웹 개발 도구를 사용할 수 있습니다.


GapDebug 라는 훌륭한 도구를 찾았습니다.

그것이 나에게 적합한 솔루션이었습니다 :)


IIS와 localhost 클라이언트를 실행하는 Windows 10 컴퓨터에 Weinre를 설치하려고 시도했지만 작동하지 않는 다른 솔루션을 찾았습니다.

Windows용 Safari는 Apple에서 중단되었지만 다음 링크를 발견한 후 복사본을 수정할 수 있었습니다. 오, Safari의 Web Inspector는 일단 설치되면 내 응용 프로그램에서 문제를 찾는 데 도움을 줄 수 있었습니다.

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

Safari가 설치되면 개발자 도구를 켜야 했습니다. 이를 위해서는 기본 설정 > 고급으로 이동 > "메뉴 표시줄에 개발 메뉴 표시" 선택 > (스프라켓 아이콘 옆에 있는 페이지 아이콘을 클릭하여 개발 위로 마우스를 이동) JavaScript에서 디버깅을 시작해야 합니다. 여기부터는 Chrome과 매우 흡사한 느낌이 들었습니다... :-)

참조URL : https://stackoverflow.com/questions/12556895/accessing-ios-safari-web-inspector-from-windows-machine

반응형