Kako koristiti web inspektor za otklanjanje pogrešaka u mobilnom Safariju (iPhone ili iPad)

Razvoj web stranica za mobilne uređaje ili otklanjanje pogrešaka u hibridnoj aplikaciji često je teško. No, srećom za ljude koji dizajniraju na iOS-u, počevši od iOS-a 6, Apple nudi značajku udaljenog web inspektora u iOS-u.

Web Inspector omogućuje programerima web i mobilnih aplikacija da koriste macOS i OS X Safari Developer Tools za daljinsko uklanjanje pogrešaka s web sadržaja ili hibridnih aplikacija u mobilnom Safariju na iPadu ili iPhoneu.

To je jednostavan i praktičan način za uklanjanje pogrešaka, optimizaciju i izmjenu vaših web stranica ili hibridnih aplikacija na iOS-u. 

Da biste pristupili tim razvojnim alatima, omogućite izbornik Razviti u naprednim postavkama Safari-ja na vašem Macu.

Slijedite ove kratke savjete kako biste pokrenuli web inspektora kako biste mogli ispraviti pogreške na web mjestu ili u aplikaciji Safari

  • Vratite postavke lokacije i privatnosti na iPhone, iPad ili iPod touch. Idite na  Postavke> Općenito> Poništi> Poništi lokaciju i privatnost
  • Obavezno se prijavite na isti Apple ID na računalu kao i vaš iPhone, iPad ili iPod touch
  • Uključite sinkronizaciju Safari iCloud za računalo i bilo koji iPhone, iPad ili iPod touch
  • Na iPhoneu ili iPadu idite na  Postavke> Safari> Napredno i uključite Web Inspector
  • Na računalu otvorite Safari i idite na  Safari izbornik> Postavke> Napredno i označite Show Develop menu na traci izbornika

Potrebno Mac računalo

Žao nam je, Windowsci, ali Safari-jev Web Inspector kompatibilan je samo s Macom!

Koristite isti Apple ID i iCloud Sync!

Obavezno prijavite se iDevice i Mac s istim Apple ID-om i uključite Safari u iCloud.

Za vaš iDevice:  Postavke> Profil Apple ID-a> iCloud> Safari  > uključeno

Za vaš Mac:  Izbornik Apple> Postavke sustava> Apple ID ili iCloud> Safari> Označeno

I provjerite je li i Safari ista verzija

Provjerite je li Safari na vašem Macu ista verzija kao i Safari na vašem iDeviceu. Možda ćete trebati ažurirati svoju verziju iOS-a ili verziju Safarija koja se izvodi na vašem Macu.

Poništite postavke lokacije i privatnosti

  1. Idite na Postavke> Općenito
  2. Odaberite Resetiraj
  3. Odaberite Resetiraj lokaciju i privatnost

Savjet za kratki rez tipkovnice za Pro za Mac za web programere

Ako pritisnete CTRL + Command + R u Safariju, odabirom uređaja možete vidjeti kako će web stranica izgledati na određenom uređaju.

Uključite ili prekidajte tipkovnicu da biste izašli iz prikaza web razvijača.

Koristite web inspektor za otklanjanje pogrešaka u mobilnom Safariju

1. Na iPadu, iPhoneu ili iPod touchu taknite Settings> Safari> Advanced i uključite Web Inspector. I omogućite JavaScript ako već nije uključen

2. Na vašem Macu pokrenite Safari i idite na Safari izbornik> Postavke> Napredno, a zatim potvrdite " Prikaži izbornik za razvoj na traci izbornika " ako to već niste učinili

3. Povežite svoj iOS uređaj s Macom pomoću USB kabela. To je kritično - uređaje morate ručno povezati kabelom. Ne radi putem WiFi-a!

4. Sada na iPadu otvorite web mjesto koje želite ispraviti, a zatim na Macu otvorite Safari i idite na izbornik " Razviti ". Sada vidite svoj iDevice koji ste povezali sa svojim Macom. Ako na iDeviceu nemate otvorenu nijednu stranicu, vidjet ćete poruku koja kaže: "Nema aplikacija koje je moguće pregledati."

5. Sada otklonite pogreške na stranici koja je otvorena u mobilnom Safariju baš kao što biste otklonili pogreške na Macu, pregledajte DOM elemente, izmijenite CSS, izmjerite performanse stranice i pokrenite Javascript naredbe.

Upotrijebite alat za otklanjanje pogrešaka koji će vam pomoći pronaći uzrok svih JavaScript pogrešaka na vašoj web stranici. Možete dodati točke prekida, otkloniti pogreške u javascriptu i provjeriti vrijednost varijabli tijekom izvođenja.

Safari bi također trebao otkriti sve CSS, HTML i JavaScript pogreške. I detalje svake pogreške vidjet ćete u programu za pronalaženje pogrešaka.

iDevice se ne prikazuje u izborniku za razvoj u Safariju?

  •  Očistite Safari predmemoriju i kolačiće
  • Ažurirajte Safari na Mac i iDevice ako je dostupno ažuriranje
    • Ako pokrenete beta verziju iOS-a ili macOS-a, možda ćete trebati pokrenuti najnoviju beta verziju na svim uređajima
  • Pokušajte s drugim kabelom i / ili priključkom na vašem Macu. Provjerite je li kabel izvorni Appleov gromobranski kabel ili MFI certificiran (napravljen za iPhone)
  • Provjerite je li web inspektor uključen. Ažuriranja za iOS ponekad to vrate na zadanu postavku ISKLJUČENO. Stoga samo provjerite  Postavke> Safari> Napredno> Web Inspector
    • Pokušajte isključiti web inspektor, pričekajte 10 sekundi i ponovo ga uključite
  • Umjesto toga isprobajte preglednik Safari Technology Preview
  • Zatvorite Safari na Macu i ponovo ga pokrenite. Provjerite prepoznaje li tada Safari vašeg Maca vaš uređaj i omogućuje li uklanjanje pogrešaka
  • Provjerite da ne koristite Safari-jev način privatnog pregledavanja ako se vaš iDevice samo nakratko prikaže u Safari-jevom izborniku Develop, a zatim nestane
  • Otvorite Monitor aktivnosti i provjerite što se događa sa Safarijem

Savjeti za čitatelje 

  • Ako upotrebljavate stariji iDevice s iOS-om 6 ili starijim, web preglednik Safari vašeg uređaja ima vlastitu ugrađenu Debug Console! Dovoljno je pristupiti Safari-ovoj Debug Console odlaskom na  Settings > Safari > Developer > Debug Console

Najnoviji postovi