È possibile aprire la console degli strumenti di sviluppo in Chrome sul telefono Android?

165

Un'applicazione AngularJS funziona bene sul desktop, ma non viene visualizzata correttamente sul dispositivo mobile (viene visualizzato il codice effettivo). Questo è su un telefono Android.

Vorrei vedere quali errori vengono visualizzati nella console.

È possibile aprire la console JS sull'app Chrome sul dispositivo mobile (come se fosse sul desktop)?

google-chrome-devtools mobile-chrome

— tim_xyz
fonte

134

Puoi farlo utilizzando il debug remoto, ecco la documentazione ufficiale . Processo di base:

Collega il tuo dispositivo Android
Seleziona il tuo dispositivo: Altri strumenti> Ispeziona i dispositivi *dagli strumenti di sviluppo su PC / Mac.
Autorizza sul tuo telefonino.
Buon debug !!

* Questo è ora "Dispositivi remoti".

— PseudoAj
fonte

2

Penso che una spiegazione dettagliata sia fornita nel link della documentazione

— PseudoAj

59

È possibile farlo senza un computer esterno?

— Eric Reed,

59

La domanda richiede una console aperta per gli strumenti di sviluppo in Chrome sul telefono Android? la tua animazione richiede una macchina di debug separata. Nella tua risposta il debug non è sul telefono stesso

— Fennekin

5

Non c'è altro modo in cui sono a conoscenza di @fennekin.

— Sentiti

5

A partire da gennaio 2019, non sono riuscito a trovare i dispositivi Inspect in Altri strumenti, l'ho finalmente trovato su chrome: // inspect e devi consentire il debug USB dal tuo telefono

— Abhinav Singh,

53

Quando non hai un PC a portata di mano, puoi usare Eruda, che è devtools per i browser mobili https://github.com/liriliri/eruda
Viene fornito come javascript incorporabile e anche un bookmarklet (incollando il bookmarklet in Chrome rimuovi il javascript: prefisso, quindi devi digitarlo tu stesso)

— trogper
fonte

1

Ottimo compagno di strumenti come Termux che rendono reale lo sviluppo su dispositivi mobili solitari! Ho già integrati eruda-webpack-pluginin un unico progetto: npm i eruba-webpack-plugin --save-optional.

— vintproykt,

Il modo più semplice per ottenere ciò che è in console

— makwana.a

Soluzione eccezionale. È disponibile in una CDN.

— netishix,

Questo non sembra funzionare per me. Incollarlo nella barra degli indirizzi (e quindi leggere "javascript:") non sembra fare nulla.

— BT,

@BT alcuni siti Web si limitano al caricamento di script dai domini consentiti elencati. Provalo su un altro sito web.

— trogper,

10

Voglio solo vedere ciò che è stato stampato nella console, puoi semplicemente aggiungere la parte "stampata" da qualche parte nel tuo HTML in modo che appaia nella pagina web. Potresti farlo da solo, ma c'è un file javascript che lo fa per te. Puoi leggerlo qui:

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

Il codice è disponibile da Github ; puoi scaricarlo e incollarlo in un file javascipt e aggiungerlo al tuo HTML

— John Balvin Arias
fonte

Cordiali saluti: Potresti riscontrare una situazione che la console NON dovrebbe mostrare. Sulla base di alcune conversazioni alla fine della sua homepage ufficiale , puoi provare ad esplicitamente mobileConsole.init(). Questo trucco aiuta nel mio caso. YMMV.

— RayLuo

1

quel collegamento funziona ancora, ci vuole solo molto tempo per caricare. Tuttavia, posso riassumere che quelle conversazioni tra me e quel proprietario lib sono finite con l'aggiunta delle seguenti informazioni nella sezione Note nella sua pagina principale: "Se mobileConsole non si avvia (il rilevamento mobile non riesce), è possibile ignorare l'avvio automatico impostando overrideAutorun su true o aggiungi il seguente script alla tua pagina: if (!mobileConsole.status.initialized) { mobileConsole.init(); } "

— RayLuo

7

Per favore, fatevi un favore e premete semplicemente il pulsante facile:

scarica Web Inspector (Open Source) dal Play Store.

A CAVEAT: ATTOW, l'output della console non accetta i parametri di riposo! Cioè se hai qualcosa del genere:

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

vedrai solo

uno

registrato sulla console. Dovrai avvolgere manualmente i parametri in un array e unirti, in questo modo:

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

per vedere l'output previsto.

Ma l'app è open source ! Una patch potrebbe essere imminente ! Il patcher potresti anche essere tu!

— Sensei James
fonte

3

Kiwi Browser è Chromium mobile e consente l'installazione di estensioni . Installa Kiwi e quindi installa l'estensione "Mini JS console" di Chrome (basta cercare su Google e installare dal sito Web delle estensioni di Chrome, anche uBlock funziona;). Sarà disponibile nel menu Kiwi in basso e mostrerà l'output della console per la pagina corrente.

— Pawel
fonte

-1

Probabilmente puoi provare Gear Browser, è in grado di ispezionare elementi e eseguire il debug del sito Web solo sul cellulare.

https://gear4.app

— Angolao
fonte

5

L'app è solo per iPhone. La domanda specificava Android.

— Pete