Czy można otworzyć konsolę narzędzi programistycznych w przeglądarce Chrome na telefonie z systemem Android?

165

Aplikacja AngularJS działa dobrze na komputerze, ale nie renderuje się poprawnie na telefonie komórkowym (wyświetlany jest rzeczywisty kod). To jest na telefonie z Androidem.

Chciałbym zobaczyć jakie błędy wyświetlają się w konsoli.

Czy można otworzyć konsolę JS w aplikacji Chrome na telefonie komórkowym (tak jak na komputerze)?

google-chrome-devtools mobile-chrome

— tim_xyz
źródło

134

Możesz to zrobić za pomocą zdalnego debugowania, oto oficjalna dokumentacja . Podstawowy proces:

Podłącz urządzenie z systemem Android
Wybierz swoje urządzenie: Więcej narzędzi> Sprawdź urządzenia za *pomocą narzędzi deweloperskich na komputerze PC / Mac.
Autoryzuj na telefonie komórkowym.
Miłego debugowania!

* To jest teraz „Urządzenia zdalne”.

— PseudoAj
źródło

2

Myślę, że szczegółowe wyjaśnienie znajduje się w linku do dokumentacji

— PseudoAj

59

Czy można to zrobić bez komputera zewnętrznego?

— Eric Reed

59

Pytanie dotyczy otwartej konsoli narzędzi programistycznych w przeglądarce Chrome na telefonie z systemem Android? twoja soultion wymaga oddzielnej maszyny do debugowania. W twojej odpowiedzi debugowanie nie jest w samym telefonie

— Fennekin

5

Nie ma innego sposobu, w jaki jestem świadomy @fennekin. Prosimy o aktualizację, jeśli uważasz, że istnieje lepszy sposób,

— PseudoAj

5

Począwszy od stycznia 2019 roku, nie był w stanie znaleźć Sprawdzić urządzenia pod więcej narzędzi, ale w końcu okazało się, że w chrome: // wglądu, i trzeba, aby umożliwić debugowanie USB z telefonem

— Abhinav Singh

53

Jeśli nie masz pod ręką komputera, możesz użyć Erudy, która jest devtools dla przeglądarek mobilnych https://github.com/liriliri/eruda
Jest dostarczana jako osadzalny javascript, a także bookmarklet (wklejenie bookmarkletu w chrome usuwa javascript: prefix, więc musisz wpisać go sam)

— trogper
źródło

1

Bardzo dobry towarzysz narzędzi takich jak Termux, które sprawiają, że programowanie na samotnych urządzeniach mobilnych jest realne! I już zintegrowane eruda-webpack-pluginw jednym projekcie: npm i eruba-webpack-plugin --save-optional.

— vintproykt

Najłatwiejszy sposób na zdobycie tego, co jest w konsoli

— makwana.a

Niesamowite rozwiązanie. Jest dostępny w CDN.

— netishix

To chyba nie działa dla mnie. Wklejenie go w pasku adresu (a następnie odczytanie „javascript:”) wydaje się nic nie robić.

— BT,

@BT Niektóre strony internetowe ograniczają się do ładowania skryptów z wymienionych dozwolonych domen. Wypróbuj na innej stronie internetowej.

— trogper

10

Jeśli chcesz tylko zobaczyć, co zostało wydrukowane w konsoli, możesz po prostu dodać "wydrukowaną" część gdzieś w swoim HTML, aby pojawiła się na stronie internetowej. Możesz to zrobić dla siebie, ale istnieje plik javascript, który zrobi to za Ciebie. Możesz o tym przeczytać tutaj:

http://www.hnldesign.nl/work/code/mobileconsole-javascript-console-for-mobile-devices/

Kod jest dostępny na Github ; możesz go pobrać i wkleić do pliku javascipt i dodać do kodu HTML

— John Balvin Arias
źródło

FYI: Możesz napotkać sytuację, w której konsola NIE pojawi się. Opierając się na rozmowie na końcu oficjalnej strony głównej , możesz spróbować to wprost mobileConsole.init(). Ta sztuczka pomaga w moim przypadku. YMMV.

— RayLuo

1

ten link nadal działa, po prostu ładowanie zajmuje dużo czasu. Niemniej jednak mogę podsumować, że ta rozmowa między mną a właścicielem biblioteki zakończyła się dodaniem przez niego następujących informacji do sekcji Notatki na jego stronie głównej: „Jeśli mobileConsole nie uruchamia się (nie udaje się wykrywanie urządzeń mobilnych), możesz zastąpić autostart poprzez ustawienie overrideAutorun na true lub dodaj następujący skrypt do swojej strony: if (!mobileConsole.status.initialized) { mobileConsole.init(); } „

— RayLuo

7

Zrób sobie przysługę i po prostu naciśnij łatwy przycisk:

pobierz Web Inspector (Open Source) ze sklepu Play.

OSTRZEŻENIE: ATTOW, wyjście konsoli nie akceptuje pozostałych parametrów! To znaczy, jeśli masz coś takiego:

console.log('one', 'two', 'three');

zobaczysz tylko

jeden

zalogowany do konsoli. Będziesz musiał ręcznie zawinąć parametry w Array i połączyć, na przykład:

console.log([ 'one', 'two', 'three' ].join(' '));

aby zobaczyć oczekiwane wyniki.

Ale aplikacja jest open source ! Poprawka może być nieuchronna ! Może to być nawet Ty!

— Sensei James
źródło

3

Przeglądarka Kiwi jest mobilnym Chromium i umożliwia instalowanie rozszerzeń . Zainstaluj Kiwi, a następnie zainstaluj rozszerzenie Chrome „Mini JS console” (po prostu wyszukaj w Google i zainstaluj ze strony rozszerzeń Chrome, działa również uBlock;). Stanie się dostępny w menu Kiwi na dole i pokaże wyjście konsoli dla bieżącej strony.

— Paweł
źródło

-1

Prawdopodobnie możesz wypróbować przeglądarkę Gear Browser, która może sprawdzać elementy i debugować witrynę tylko na urządzeniach mobilnych.

https://gear4.app

— Angolao
źródło

5

Aplikacja jest przeznaczona tylko dla iPhone'ów. Pytanie dotyczyło Androida.

— Pete