mobiililaitteiden verkkosivujen ja verkkosovellusten testaus ja virheenkorjaus voi olla haastavaa. Puhelimissa ja tableteissa olevilla selaimilla ei useinkaan ole sisäänrakennettuja debuggereita, eikä mobiililaitteiden emulointi ole koskaan niin tarkkaa kuin haluaisi. Debug mobiili sivustoja, Android, työpöydän versio Chrome tarjoaa ratkaisun kauko virheenkorjaus.,
Tämä artikkeli näyttää, miten käyttää remote debugging with Chrome tietokoneesta. Voit käyttää yhtä yleisistä työpöydän käyttöjärjestelmistä, kuten Windowsia, macOS: ia tai Linuxia.
Miten debug Android Chrome
Jos luulet, saatat olla bugi mobiili verkkosivuilla tai natiivi sovellus Android, mutta ei aivan pin se alas, Raygun tukee JavaScript kaatua raportointia sekä Android crash raportointi. Voit ottaa ilmaisen 14 päivän kokeilujakson täällä.
perustaa
Ennen kuin voit tehdä mitään remote virheenkorjaus, sinun täytyy määrittää, että tietokone pystyy tunnistamaan oman Android-laitteen., Tämä tarkoittaa sitä, että Chromen debuggeri tunnistaa ja liittää puhelimeen. Voit aloittaa asettamalla joitakin vaihtoehtoja puhelimessa.
puhelimen Asetukset
Avaa puhelimen asetussovellus. Sinun täytyy ottaa kehittäjä vaihtoehtoja,Jos et ole jo. Voit tehdä tämän, mene ”tietoja puhelin” valikko, joka sijaitsee sisällä järjestelmän valikon moderneissa Android-laitteissa. Kun olet siellä, Selaa pohjaan ja kosketa ”rakentaa numero” seitsemän kertaa. Nyt, palaa edelliseen näyttöön tai” järjestelmä ” – valikkoon Asetukset-sovelluksessa., Siellä, löydät nyt uuden valikon kohteen nimeltä ”kehittäjä vaihtoehtoja” lähellä pohjaa.
kun olet sisällä Kehittäjävaihtoehdot, ota ne käyttöön puhelimessasi klikkaamalla sivun yläreunassa olevaa vipua. Kun toggle sanoo ”On”, vieritä alas hieman ja ota” USB-testaus ” samoin. Näin voit debug laitteen USB – kaapeliliitännän kautta.
Computer setup (käyttäen Android USB-testaus)
Kuljettajan asennus
Se on kaikki mitä voimme tehdä puhelimessa, nyt, niin mennään meidän tietokone on valmis., Toteutettavat toimet ovat hieman erilaisia jokaisessa Isossa käyttöjärjestelmässä.
Jos käytät Windowsia, sinun on ensimmäiseksi asennettava laitteen USB-ajurit. Android Studio verkkosivuilla on luettelo paikoista löytää ajurit sekä joitakin ohjeita siitä, miten asentaa ajurit tietokoneeseen. Jotkut valmistajat tarjoavat linkkejä ajuritiedostoon. Toiset vain johtaa sinut tukea verkkosivuilla, jolloin sinun täytyy tehdä vähän etsimällä löytää ajurit laitteen.,
Jos tietokoneesi käyttää macOS: ää tai Linuxia, sinun ei tarvitse asentaa ajureita. Mac-käyttäjät ovat itse asiassa valmiita lähtemään. Jos koneesi toimii Linuxissa, tarvitaan vielä muutamia asennusvaiheita. Sinun täytyy varmista, että käyttäjätili kuuluu tiettyyn ryhmään ja sinun täytyy asentaa paketin ns. ”udev sääntöjä”. Ne ovat kokoonpanoja, jotka tekevät tiettyjä USB-laitteita tunnetuksi Linux-tietokoneeseen. Jos olet kiinnostunut lisää yksityiskohtia, olen kirjoittanut omistettu artikkeli Linux setup ADB jokin aika sitten.,
Asenna Android Debug Bridge (ADB)
Kun olet saanut ajurit tai udev-sääntöjä asennettu, sinun on myös ADB, joka tarjoaa rajapinnan puhua mobiililaitteeseen. ADB ja muut Android-alustatyökalut tulevat Android Studiolla, mutta voit ladata ne myös erikseen.
joko Android Studion sulautetun Android SDK: n tai Googlen virallisen alustatyökalupaketin käyttäminen on ensisijainen tapa edetä. Alustatyökalupaketit ovat vain .zip-tiedostot, jotka sisältävät kansion platform-tools., Kun olet purkanut tiedostot löydät binäärit kuten adb.exe (Windows) tai adb (macOS ja Linux) siellä. Voit sitten suorittaa ne tarpeen mukaan valitsemastasi kuoresta tai pääteikkunasta.
Jos sinulla on Windows ja halua kaikkein minimaalinen versio ADB ilman fluff, katso XDA Foorumeilla; selaa Suosio nimike ja valitse ensimmäinen linkki tässä osiossa.
kun se on ladattu, suorita se asentaa ADB., Kun se on asennettu, sinun täytyy siirry kansioon, johon se on asennettu (C:\Program Files(x86)\Minimal ADB and Fastboot oletuksena) ja kaksoisnapsauta cmd-here.exe. Tämä avaa komentorivi-ikkunan kyseisessä kansiossa.
Käyttämällä joko tekniikoita, sinun shell-ikkuna, kirjoita adb start-server käynnistä ADB palvelimen.
huomaa: ADB-palvelimen täytyy olla käynnissä milloin haluat debugata. Jos käynnistät tietokoneesi uudelleen, palvelin ei toimi automaattisesti. ADB: tä ei suositella pysyväksi taustapalveluksi.,
viimeinen asia, joka meidän täytyy tehdä, on perustaa tietokone on mahdollistaa remote debugging Chrome-kehittäjän työkaluja. Voit tehdä tämän, avaa Chrome tietokoneella ja mene DevTools-asetukset chrome://inspect/#devices
debug sivustot Android-täältä, varmista, että ”Löytää USB-laitteet” on valittuna. Suosittelen myös pitämään tämän osan kehittäjän työkaluja auki välilehdessä, koska tarvitsemme sen uudelleen pian.
yhteyden
Se on niin pitkälle kuin voit saada joko laitteen omasta., Debug sivustoja Android laitteessa, meidän täytyy kytkeä ne yhteen. Jos et ole jo, kytke puhelin tietokoneeseen USB. Jos et tehnyt tätä osana kuljettajan asennus, saatat nähdä ilmoituksen tehtäväpalkissa kertoa, että tietokone on perustamassa uuden laitteen. Varmista, että puhelin on päällä ja lukitsematon. Jos se on ja ADB-palvelin on käynnissä, sinun pitäisi nähdä ponnahdusikkuna otsikolla ” salli USB-testaus?”.
Jos se ei näy, katso ilmoitusalueella Android-laitteen., Jos se sanoo ”Kytketty medialaitteena”, jotain sellaista, tai jotain ”MTP”, klikkaa sitä. Sen pitäisi tuoda sinut näyttöön, jonka avulla voit valita eri yhteys tyyppi. Tarkoitukseen ”kamera (PTP)” on sopiva Liitäntätyyppi. Kun olet valinnut PTP, ”Salli USB-testaus?”popupin pitäisi tulla ylös.
jotta et joutuisi käsittelemään tätä ponnahdusikkunaa joka kerta, kun yhdistät laitteesi, tarkista ”Salli aina tältä tietokoneelta” – vaihtoehto. Joka tapauksessa, haluat klikata ”OK”, joka antaa mobiililaitteen näkyä tietokoneeseen virheenkorjaus., Tässä vaiheessa, palaa DevTools välilehti katsoimme aiemmin. Jos kaikki meni hyvin, sinun pitäisi nähdä puhelimen ja kaikki sen Chrome välilehdet lueteltu siellä nyt.
Debug-sivustot käynnissä Chrome-laitteeseen
Nyt on aika lopettaa saada perustaa ja aloittaa testaus! Lopultakin! Chrome tietokoneen pitäisi näyttää luettelo välilehdet auki Chrome-selaimessa etälaitteen. Jos välilehti haluat debug ei ole aktiivinen välilehti, voit klikata ”focus välilehti” tehdä aktiivinen välilehti laitteen. Napsauta sitten ”tarkasta” – linkkiä.,
tämä nostaa esiin kyseisen välilehden tarkastajan. Täältä, voit käyttää Chromen Kehittäjä työkaluja melko paljon kuin olisit, jos olit virheenkorjaus web-sivun työpöydällä selaimessa. Voit jopa nähdä laitteen näytön kehittäjän työkaluissa. Jos se ei ole jo näkyvissä, tai jos haluat vaihtaa se pois päältä, klikkaa kuvaketta vieressä tarkastaja kuvaketta vasemmassa yläkulmassa kehittäjä työkaluja.
Debugging vinkkejä
Voit myös hallita laitteen kehittäjän työkalut., Käytä hiiren kursoria näytölle valettu kuin kursori olisi sormi laitteen itse.
- Klikkaa hyödyntää
- Klikkaa ja vedä pyyhkäisemällä
- Käytä rullaa selaa
- Pidä
Shiftsamalla, kun vedät ylös lähennä - Pidä
Shiftkun vedät alas zoomaus ulos
saatat huomata, että on olemassa joitakin avoimia paikkoja näytön valettu. Nämä ovat käyttöliittymäelementtejä Chrome-sovelluksesta tai laitteen käyttöliittymästä., Ne ovat piilossa, koska etävianetsintäprotokolla vain voit olla vuorovaikutuksessa web-sivun itse.
vanhemmissa ja vähemmän tehokkaissa laitteissa näyttöruutu käyttää paljon mobiililaitteesi käsittelytehoa. Saatat huomata, että suorituskyky tuntuu hitaalta, kun olet näytön valu. Näin, jos yrität mitata suorituskykyä, poistaa näytön valettu ja vuorovaikutuksessa suoraan mobiililaitteeseen.
lopulta, jos törmäät ongelmiin, joissa mitään ei tapahdu, kun olet vuorovaikutuksessa laitteesi kanssa, yritä sulkea Chrome-sovellus ja avata se uudelleen., Sinun täytyy kytkeä uudelleen etälaitteeseen DevTools-näytön kautta kehittäjän työkaluissa. Jos tämä ei auta, mene läpi tämä nopea tarkistuslista:
- Irrota laite ja kytke se takaisin sisään
- Lukitse puhelin ja herättää se takaisin ylös
- Lähellä kehittäjän työkalut-ikkuna ja avaa se uudelleen.
päätelmä
Android Chromen mobiilisivustojen virheenkorjauksen ei tarvitse olla vaikeaa. Se voi kestää hieman enemmän setup kuin useimmat meistä haluaisivat. Mutta, kun se on hoidettu, virheenkorjaus mobiili web-sivun laitteen tulee paljon yksinkertaisempi., Voit nyt debug Android mobile sivustot todellinen fyysinen laite.
käytitkö liikaa aikaa bugisi löytämiseen? Raygun auttaa havaitsemaan, diagnosoimaan ja tuhoamaan JavaScript-tai Android-koodin virheet. Smart hälytykset ja virhe ryhmittely tarkoittaa, et koskaan missaa vika sovelluksessasi uudelleen. Lue lisää Android crash raportointi ja JavaScript crash raportointi.
Lisää virheenkorjaus Android
Miten arkkitehti virheet parempi virheiden raportointi
Get alkoi kanssa remote debugging Android