Xcode에서 PhoneGap 앱의 자바 스크립트 오류를 ​​확인하는 방법은 무엇입니까?

Xcode에서 PhoneGap 앱의 자바 스크립트 오류를 ​​확인하는 방법은 무엇입니까?

---

Xcode에서 PhoneGap 앱을 디버깅하고 싶지만 콘솔에서 자바 스크립트 오류를 ​​표시 할 수 없습니다.

---

Cordova / PhoneGap 앱에서 JavaScript 오류를보고 디버그하는 가장 우아한 방법은 Safari 브라우저의 Web Inspector를 iOS 앱의 Web View에 연결하는 것입니다 (그러나 이미 언급 한 Tom Clarkson과 마찬가지로 iOS 6 이상이 필요합니다. ).

• iPad 또는 iPhone에서 설정 앱을 사용하여 Safari의 고급 설정에서 Web Inspector를 활성화하십시오.
• USB를 통해 기기를 Mac에 연결합니다 (그러면 Safari의 개발 메뉴 아래에 나타납니다).
• 앱 시작
• 디버깅 할 웹보기로 이동합니다.
• Mac의 Safari 개발 메뉴에서 하위 메뉴에서 장치 이름과 앱 (HTML 페이지)을 선택합니다.
• Web Inspector 창이 열리면 DOM을 탐색하고 중단 점을 설정할 수 있습니다.

이 설정에 대한 Apple 문서

철저한 타사 자습서

또는 iOS WebKit Debug Proxy를 설치 한 후 Chrome의 Web Inspector를 iOS 기기에 연결할 수 있습니다 . 이것은 또한 Linux 또는 Windows에서 검사를 수행 할 수있는 기능을 제공합니다.

앞서 언급 한 디버그 프록시 위에 RemoteDebug iOS WebKit 어댑터 를 설치할 수 있기 때문에 iOS의 HTML, CSS 및 JavaScript에 대한 원격 액세스가 요즘 훨씬 더 유연 해졌습니다 . 이 어댑터는 WebKit 원격 디버깅 프로토콜 을 Chrome 디버깅 프로토콜 로 변환하므로 (지원되는 모든 플랫폼에서) 대체 디버깅 및 검사 도구로 사용할 수 있습니다.

• Visual Studio 코드
• Chrome DevTools
• Mozilla 디버거

BTW, Safari Web Inspector를 사용한 원격 디버깅은 iOS 시뮬레이터와 결합하여도 작동합니다.

---

iOS 버전 당 데스크톱 Safari의 최소 버전

iOS의 각 버전에 대해 원격 웹 검사를 사용하려면 특정 최소 버전의 Desktop Safari가 필요합니다. 아래 목록을 참조하십시오.

iOS 6

Safari 6 이상

IOS 7

Safari 6.1 이상

iOS 8

Safari 7.1 이상

iOS 9

Safari 8 이상

iOS 10

Safari 9 + / 10 +? 의견을 부탁합니다; 항상 Safari Technology Preview를 사용해보십시오

iOS 11

Safari 11 이상

iOS 12

Safari 12 이상

---

다른 JavaScript보다 먼저 실행되도록 문서 시작 부분 근처에 다음을 붙여 넣으십시오.

<script type="text/javascript">
    window.onerror = function(message, url, lineNumber) {
        console.log("Error: "+message+" in "+url+" at line "+lineNumber);
    }
</script>

Xcode 콘솔 창에서 Javascript 오류에 대한 세부 정보를 확인하십시오.

UPDATE: The above technique will log errors such as undefined variables. But syntax errors such as missing commas will still cause the entire script to break without logging anything.

Therefore you should add the following to the start of your onDeviceReady function:

console.log('Javascript OK');

If you don't see "JavaScript OK" appearing in your log window when the app launches, then it means you have a syntax error somewhere.

To save hunting for missing commas, the easiest thing is to paste your code into a Javascript validator such as this one:

http://www.javascriptlint.com/online_lint.php

and let it find the error for you.

Hopefully that takes some of the pain out of debugging.

---

Note that with 0.9.2 (released today), console.log has been standardized across the platforms for logging (with debug.log deprecated).

There is a function that is available on the desktop WebView that is not exposed in the iOS UIWebView that will catch all errors (I'm trying to hack that functionality into a plugin, which uses private APIs, but the plugin would only be for development), but for now do what Kris suggested above and put try catch blocks on code and use console.log

To quickly catch possible syntax errors, when developing I have the page loaded in desktop Safari and quickly refresh it with the webkit error console viewable.

---

debug.log will send messages to the XCode console in Phonegap (allowing you to either log the result of an exception or do some debugging), however, you are correct that you have to debug other javascript errors in Safari (either on the desktop or on the iphone with Debug Console turned on). I have yet to find a Javascript error, that was caused by running on the iphone and wasn't present when debugging with the console turned on in Safari (though I know there are a few differences between the WebView and Safari on the iphone).

---

I just came across Weinre

It's a remote javascript debugger for phonegap. You can either setup your own Weinre server, or use the one at http://debug.phonegap.com/

It seems to work well - very impressed so far.

---

If you use iOS 6, you can simply attach the safari web inspector (on the develop menu of desktop safari) to your app and get full javascript debugging.

There are a couple of areas where it is a bit limited - startup errors and plugin calls - but it works well for pretty much anything else.

---

For making javascript debugging work in Xcode I would take a look at the following.

http://phonegap.com/2011/05/18/debugging-phonegap-javascript/
http://www.daveoncode.com/2010/01/12/debugging-phonegap-applications-using-xcode-console/

As as far as additional troubleshooting goes...
To start with you could run the app in safari on you pc and utilize safari's debugger (or chrome as both are running similar rendering engines). This won't hit on the advanced logic errors and many of your api issues but it at the very least should help with troubleshooting many issues (basic javascript, HTML5 etc....).

---

To view all errors in javascript console, I agree to use this event listener

<script type="text/javascript">
    window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln );};
    var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>

However, unless you have the cordova plugin installed, it wont show on XCodes "console". Go to your project folder and type this:

? cordova plugin add cordova-plugin-console

This will allow the javascript command 'console.log('some string') to show on XCode.

Note you will need git, etc... but if you are editing your phonegap project in xcode, you will most probably have it!

PS Make sure you put the cordova.js script plug-in before any use of console.log

<script type="text/javascript" src="/cordova.js"></script>

---

Put this in the beginning of your index.html

<script type="text/javascript">
    window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln);};
    var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>

---

Here's a simple way that worked for me:

• cd to the directory containing your index.html file in the terminal

• Start a http server using python by invoking (I used python 2.7):

  python -m SimpleHTTPServer

• View the page in safari by entering the address of the HTTPServer in a browser, for me the URL was:

  http://0.0.0.0:8000/
  

• Open developer tools:

  In chrome this is alt+command+i. View the console tab, may need to refresh the page.

  In Safari: Safari --> Preferences --> Advanced --> check "Show Develop Menu". Develop menu --> Show error console (or alt+command+c). Refresh the page. Hitting CTRL+5 opens the issues tab.

참고 URL : https://stackoverflow.com/questions/4022152/how-to-see-the-javascript-errors-of-phonegap-app-in-xcode