Come debug remoto App Android Web e siti Web in Linux

Il debug di siti Web e app Web destinati ai dispositivi mobili può aiutare a risolvere i problemi e migliorare l'esperienza dell'utente sui dispositivi portatili. Questo articolo spiegherà come eseguire il debug di qualsiasi sito Web in esecuzione in un browser o WebView a base di Chrome / Chromium su un dispositivo Android. Si noti che Firefox supporta anche il debug remoto dai dispositivi Android. Tuttavia, non sono riuscito a farlo funzionare sul mio sistema Linux, quindi l'articolo coprirà solo le istruzioni per il debug di siti Web / app Web resi nel browser Chrome o WebViews basato su Chrome / Chromeum su un dispositivo Android.

Per eseguire il debug di qualsiasi pagina Web attualmente visibile nel browser Chrome o WebView su un dispositivo Android, sarà necessario abilitare il debug USB e collegare il tuo dispositivo Android a un PC Linux tramite un cavo USB.

Abilitare il debug USB su un dispositivo Android

L'interruzione del debug USB è disponibile nel menu "Opzioni per sviluppatori" nascoste sui dispositivi Android. Per abilitare la visualizzazione delle opzioni sviluppatore, è necessario toccare la voce "build numero" 7 volte nelle impostazioni di sistema. Poiché ci sono numerosi dispositivi Android con diverse interfacce utente e versioni, non esiste un modo standard per trovare il numero di build. È possibile utilizzare la barra di ricerca nelle impostazioni del sistema Android per individuare e andare direttamente all'opzione Numero di build oppure è possibile navigare manualmente per trovarlo. Di solito, si trova nello stesso menu che mostra la versione del kernel Linux su un dispositivo Android.

Dopo aver abilitato le opzioni per gli sviluppatori, attiva l'interruttore per il debug USB. Fai attenzione a non toccare altre impostazioni nelle opzioni degli sviluppatori poiché l'errore di configurazione può portare alla rottura del sistema. Per riferimento, ecco come appare l'opzione di debug USB sul mio dispositivo Android Samsung:

Installazione di Android Debug Bridge (ADB) su Linux

ADB è uno strumento di debug ufficiale fornito da Google per debug Android OS e dispositivi Android. Facilita la condivisione e la comunicazione dei dati tra un PC e un dispositivo Android. ADB è richiesto per il debug remoto di una pagina Web attualmente in diretta su un dispositivo Android. Viene anche utilizzato per autenticare e verificare la connessione del dispositivo Android con il tuo PC Linux.

Per installare ADB su Ubuntu, eseguire il comando di seguito:

$ sudo APT Installa ADB

I pacchetti ADB sono disponibili per impostazione predefinita su quasi tutte le principali distribuzioni Linux. Se si utilizza una distribuzione Linux diversa da Ubuntu, cerca il termine "ADB" nel gestore dei pacchetti e installalo da lì.

Ora collega il tuo dispositivo Android al tuo sistema Linux tramite un cavo USB. Nel caso in cui tu stia collegando il dispositivo Android abilitato per il debug USB per la prima volta, riceverai un prompt di autorizzazione sul tuo dispositivo Android. Devi accettarlo per procedere oltre. Esegui il comando di seguito dopo aver accettato il prompt per verificare la connessione riuscita e lo stato di autenticazione:

Dispositivi $ ADB

Lo screenshot seguente mostra l'output del comando. Se riesci a vedere un numero di serie nell'ambito dell'elenco "Elenco dei dispositivi allegati", è stata effettuata una connessione riuscita. Se c'è una parola chiave "non autorizzata" proprio accanto al numero seriale, scollegare il dispositivo, riconnetterlo e quindi accettare di nuovo il prompt di autorizzazione (potresti aver perso il prompt o chiuso accidentalmente).

Debug remoto una pagina Web mobile sul browser Desktop Chrome

Digita l'URL "Chrome: // Ispect/#Devices" nella barra degli indirizzi Chrome e premere Invio chiave. Controlla la casella di controllo "Scopri i dispositivi USB". Ora sarai in grado di vedere un elenco di tutti i siti Web / app Web aperti in Chrome, Chromium o qualsiasi browser a base di Chrome / Chromium o WebView sul tuo dispositivo Android.

Basta fare clic sul link "Ispeziona" per iniziare il debug. Otterrai lo stesso set completo di strumenti per sviluppatori disponibili per il debug di siti Web su un PC desktop.

Nota che il sito Web o il webapp Il tuo debug dovrebbe essere visibile e vivere sul tuo dispositivo Android. Se si cambia app, schede o gira fuori dallo schermo, l'area di anteprima potrebbe essere scaricata.

Conclusione

Collegare il tuo dispositivo Android a un PC Linux per i siti Web di debug remoti è piuttosto semplice e fa un paio di passaggi. Mentre è possibile eseguire il debug di layout reattive e simulare le viste mobili sul desktop stesso, il debug remoto è particolarmente utile se si sviluppano app ibride per Android o utilizzando WebViews.