Cum depanați paginile web pe Chrome pentru computer pe Android

Ca administrator al unui blog, depanez site-ul meu personal folosind Chrome pentru a vedea cum ar arăta modificările din temă și CSS înainte de a le implementa permanent pe server. Nu am fost cu mult timp în urmă când nu am acordat niciodată atenție paginilor mobile, deoarece doar puțini vizitatori au vizitat site-ul meu folosind un smartphone. Dar astăzi, un procent semnificativ de vizitatori cuprinde smartphone-uri și tablete și, prin urmare, a devenit necesar să avem grijă și de aspecte și prezentări acolo.

Dacă ar fi fost o pagină pe computer, una ar fi putut fi depanată ușor folosind opțiunea din meniul contextual al clicului dreapta al Chrome, dar aceasta nu este opțiunea cu paginile de pe mobil. Așadar, astăzi vă voi arăta cum puteți depana paginile web mobile pe computer folosind Chrome pentru Android și Android SDK.

Debugarea paginii web

Pasul 1: Descărcați și instalați SDK-ul Android pe computer și rulați-l. Instalatorul vă va solicita să descărcați Java dacă nu îl aveți instalat.

Pentru prima dată când executați Android SDK pe computer, vă va cere să descărcați mai multe API-uri și instrumente. Dacă scopul tău de a instala Android SDK este depanarea paginilor, debifează totul, cu excepția instrumentelor Android SDK Platform și faceți clic pe butonul Instalare pachet.

Pasul 2: După instalarea instrumentelor platformei Android, deschideți Run Box (Windows + R) și executați % userprofile% \ AppData \ Local \ Android \ android-sdk \ platform-tools pentru a deschide directorul instrumentelor platformei Android.

Pasul 3: Acum țineți tasta Ctrl + Shift și faceți clic dreapta în folder pentru a deschide promptul de comandă acolo. Puteți, de asemenea, deschide promptul de comandă folosind caseta Run și navigați manual la folder.

Pasul 4: După aceasta, deschideți Chrome pe telefonul dvs. Android, deschideți Setări -> Instrumente pentru dezvoltatori și verificați opțiunea Activați debugging-ul USB Web.

Pasul 5: Acum, la promptul de comandă, executați comanda adb forward tcp: 9222 localabstract: chrome_devtools_remote și deschideți browserul Chrome pe Windows la executarea cu succes.

Pasul 6: Deschideți pagina pe care doriți să o depanați în browserul dvs. Chrome Android și deschideți URL localhost: 9222 în browserul Chrome al computerului.

Cu toate acestea, veți vedea toate paginile care sunt deschise pe browserul dvs. Android ca niște miniaturi pe computer. Pentru a deschide pagina de depanare, trebuie doar să faceți clic pe miniatura respectivă a site-ului. Veți putea urmări în timp real modificările pe care le faceți pe computer direct pe Android.

Concluzie

Sunt sigur că acest truc îi va ajuta pe mulți dezvoltatori web să își optimizeze paginile web pentru smartphone-uri. Am folosit trucul pentru a-mi configura paginile web și a funcționat ca farmec. Cu toate acestea, dacă cunoașteți o modalitate mai bună de a depana pagini web de smartphone pe computer, împărtășiți-o cu noi.