Jakie są metody debugowania JavaScript wewnątrz UIWebView?


136

Próbuję dowiedzieć się, dlaczego coś z JavaScriptem nie działa w UIWebView. O ile mi wiadomo, nie ma możliwości ustawienia punktu przerwania wewnątrz XCode dla pliku js. Nie ma problemu, po prostu wrócę do 2004 roku i użyję statystyk alertów - och, czekaj, one też nie działają w UIWebView!

Jedyne, o czym mógłbym pomyśleć, to wyeksportowanie moich plików HTML i JS na mój pulpit, a następnie wykonanie debugowania w Safari. I to działa! Ale oczywiście błąd, z którym walczę w UIWebView, nie występuje w Safari.

Czy są jakieś inne sposoby debugowania wewnątrz UIWebView lub jakieś sztuczki, których mogę użyć, podobnie jak przy użyciu starej metody alertów?

Odpowiedzi:


277

Jeśli używasz iOS> = 6 i masz górskiego lwa (10.8) lub Safari> = 6, możesz po prostu:

  1. Otwórz aplikację w symulatorze (lub swoje urządzenie w XCode> = 4.5.x).
  2. Otwórz Safari (przejdź do Preferences -> Advancedi upewnij się, że opcja „Pokaż menu programowania w pasku menu” jest włączona.
  3. Z paska menu (przeglądarki Safari) wybierz Develop -> iPhone Simulator -> [your webview page].

Otóż ​​to !


6
Działa to tylko wtedy, gdy aplikacja jest uruchomiona w symulatorze. Jeśli musisz używać urządzenia z systemem iOS do debugowania, zobacz to podejście mobiarch.wordpress.com/2013/04/06/ ...
RajV

7
@RajV Możesz debugować UIWebViews na fizycznym urządzeniu, ale tylko te, które umieścisz bezpośrednio z XCode na swoim urządzeniu, a nie te z Appstore.
alecail

1
Całkiem oczywiste, ale może być pomocne. Przetestowałem to na symulatorze iOS7 z systemem OSX 10.9 Mavericks i Safari 7 - działa pięknie. Dzięki za to.
Moe

1
@refaelos Thanks !! Działa z moim fizycznym urządzeniem, jeśli używam tymczasowego profilu programistycznego.
umang2203

11
Nie jestem pewien co do symulatora, ale aby to działało na urządzeniu, musisz włączyć opcję w ustawieniach. Settings> Safari> Advanced> Web Inspector<- to umożliwić
Hodson

31

To zapytanie znajduje się na szczycie Google, więc warto połączyć się z remoteInspector ukrytym w iOS5 - zdecydowanie najlepszym znalezionym dotychczas sposobem debugowania UIWebViews - po prostu kompiluj warunkowo przed wysłaniem do Apple.


3
Nadal działa, używaj go w ten sposób: [NSClassFromString(@"WebView") performSelector:@selector(_enableRemoteInspector)];pamiętaj, aby usunąć wywołanie podczas kompilacji do wydania!
przesłanie

1
To świetna technika. Należy jednak pamiętać, że debugger wydaje się działać tylko w Safari. Wypróbowałem to z innych przeglądarek (na przykład chrome) i nic nie pokazało.
Sagi Mann


9

alert () z pewnością działa dla mnie.

Możesz jednak zrobić również wiele innych rzeczy, na przykład utworzyć własny alert DHTML, który pojawi się w warstwie. Może to być przyjemne, ponieważ możesz zrobić wiele alertów dla jednego elementu DIV bez zatrzymywania aplikacji. Powinieneś także móc zapisać do niego ślad stosu (ślad stosu znajduje się w obiekcie wyjątku i zawsze możesz zgłosić własne wyjątki).

Alternatywnie, jeśli działasz na symulatorze, twoja niestandardowa funkcja „alert ()” może wywołać cel C i wyświetlić ciąg znaków w oknie konsoli symulatora iPhone'a:

document.location.href = "http://debugger/" + 
   encodeURIComponent(outputString);   

a po stronie obiektywu C:

//--------------------------------------------------------------------
- (BOOL)webView:(UIWebView*)webView 
       shouldStartLoadWithRequest: (NSURLRequest*)req 
       navigationType:(UIWebViewNavigationType)navigationType {
    if ([[[req URL] host] isEqualToString:@"debugger"]){
        // do stuff with [[req URL] path] 
       }
}

To powiedziawszy, mam aplikację, która jest ciężka w UiWebView / javascript i zwykle robię większość programowania javascript w Chrome (symulując to, co jest konieczne ze środowiska iPhone'a)


co masz na myśli przez „alert ()” na pewno działa dla mnie? Wykonywanie wezwania do Objective-C jest kreatywne, zdziwiony, że wcześniej o tym nie pomyślałem, ponieważ już trochę to robię! Dzięki. :)
bpapa

Tak, alert () działa dobrze. Może nie w starszej wersji? Ale właśnie to wypróbowałem i otrzymałem wyskakujące okienko, które wygląda prawie identycznie jak to zrobione z UIAlertView po stronie objC.
obrabować

8

Mam niesamowity sposób debugowania UIWebView lub SFSafariViewController .

Mam nadzieję, że to pomoże.

Krok 1: 
 Otwórz Safari VC na swoim Macu (hahaha, nie rób swojej twarzy, jeśli mówię na twoim Macbooku, po prostu wykonaj moje kroki)



Krok 2: Przejdź do preferencji Safari i kliknij Advance. Otrzymasz to ustawienie na ekranie MacBooka.

wprowadź opis obrazu tutaj

Teraz włącz Pokaż, aby rozwinąć menu na pasku menu. Teraz Twoja Cała praca jest wykonana. Myślisz, że żartuję: P: P nie, człowieku ... 



Krok 3: Uruchom aplikację w urządzeniu lub w symulatorze. (Don't Think Just run) I przejdź do aplikacji, w której otwierasz Webview lub SFSafariViewController. Do tej pory nie rozumiałeś, wiem. Spokojnie i zobacz mój następny krok.

Krok 4: Otwórz Safari na swoim MacBooku i kliknij opcję Rozwiń na pasku menu. Czy masz coś, co Twój MacBook, iPad / iPhone wyświetla dobrze ?????

wprowadź opis obrazu tutaj



Krok 5: Gotowe. kliknij swoje urządzenie i kliknij URL Nowe okienko wyskakuje w ten sposób. wprowadź opis obrazu tutaj




Krok 6: to, czego teraz szukasz, to tutaj wszystkie kroki.

Teraz debuguj swoją stronę internetową na tej konsoli. Bądź szczęśliwy i ciesz się swoim dniem podczas programowania przy filiżance herbaty lub kawy.

IMP: Nie zapomnij włączyć opcji Zobacz poniżej obraz wprowadź opis obrazu tutaj 









6

Jeszcze tego nie próbowałem, ale spójrz na tego Weinre

Wygląda bardzo obiecująco.


weinre jest fajny, ale uważaj, że nie jest dostarczany z debugerem JS. to tylko „inspektor sieci”. (Nie zauważyłem tego, dopóki nie zadałem sobie wiele trudu, aby skonfigurować go na moim iPhonie.)
Dan Fabulich

Wygląda na to, że Weinre przestał działać od czasu Lion: nie mogę już uzyskiwać połączeń, prawdopodobnie problem z piaskownicą.
przesłanie

Wygląda na to, że Adobe ma teraz umowę z Weinre i oferuje aplikację o nazwie Adobe Shadow, która ją implementuje. Działa całkiem dobrze.
Adrian Harris Crowne

Zainstalowałem weinre przez npm (menedżera pakietów node.js) i działa dla mnie w Mountain Lion. npm install -g weinre
wprl

2
Odpowiedzi zawierające tylko łącze lepiej nadają się jako komentarz.
Joris Meys

4

To jest stare pytanie. Ale nadal będę chciał podzielić się moimi dwoma centami.

Używam jsconsole.com do zdalnego debugowania. To jest łatwe. Wystarczy dołączyć tag skryptu i użyć dzienników konsoli do debugowania przez drukowanie. Może to również służyć do debugowania na prawdziwym urządzeniu.


3

Stare pytanie, ale chyba znalazłem najlepsze rozwiązanie, w moim przypadku trzeba debugować uiwebview, ale nie miałem dostępu do aplikacji IOS a tylko do treści html i musiałem przejrzeć kilka logów JS, dodałem następujący kod aby załadować lekki firebug JS i wyświetlić go automatycznie:

wywołując go z JS

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://getfirebug.com/firebug-lite-debug.js';
document.head.appendChild(script);

lub załaduj go z html

<script type="text/javascript" src="https://getfirebug.com/firebug-lite-debug.js"></script>

-1

Możesz skonfigurować system podobny do używanego w PhoneGap do wysyłania wiadomości z JavaScript do Objective-C i stamtąd do logowania. Krótko mówiąc, ustawiają document.location przy użyciu niestandardowego schematu i blokują ten schemat w wywołaniu zwrotnym delegata.

Możesz skorzystać z faktu, że UIWebView jest większością delegatów dla WebView. WebKit jest technicznie nieudokumentowany dla iPhone'a, ale w większości jest taki sam, jak określono w nagłówkach WebKit dla komputerów stacjonarnych, prawdopodobnie włączając WebScriptObject. Używam tego do debugowania, ale pamiętaj, aby usunąć ten kod przed przesłaniem do Apple.

Aby uzyskać WebView z UIWebView, zaimplementuj metodę delegata, taką jak -(void) webView:(id)inWebView didFinishLoadForFrame:(id)inWebFramew podklasie UIWebView. Zadzwoń super, jeśli używasz tego.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.