Ako používať webový inšpektor na ladenie mobilného Safari (iPhone alebo iPad)

Vývoj webových stránok pre mobilné zariadenia alebo ladenie hybridnej aplikácie je často ťažké. Ale našťastie pre ľudí, ktorí navrhujú iOS, od iOS 6 už Apple ponúka funkciu vzdialeného webového inšpektora v iOS.

Web Inspector umožňuje vývojárom webových a mobilných aplikácií používať vývojové nástroje Safari pre MacOS a OS X na vzdialené ladenie webového obsahu alebo hybridných aplikácií v mobilnom Safari na iPade alebo iPhone.

Je to jednoduchý a praktický spôsob ladenia, optimalizácie a úpravy vašich webových stránok alebo hybridných aplikácií v systéme iOS.

Ak chcete získať prístup k týmto vývojovým nástrojom, povoľte vo svojich predvoľbách Rozšíreného prehliadača Safari na počítači Mac ponuku Vývoj.

Podľa týchto rýchlych tipov môžete pracovať s webovým inšpektorom, aby ste mohli ladiť svoje stránky alebo aplikácie pre Safari

  • Obnovte svoje nastavenie polohy a nastavenia súkromia na svojom iPhone, iPade alebo iPode touch. Ísť doNastavenia> Všeobecné> Obnoviť> Obnoviť polohu a súkromie
  • Uistite sa, že ste sa v počítači prihlásili do rovnakého Apple ID ako váš iPhone, iPad alebo iPod touch
  • Zapnite synchronizáciu Safari iCloud pre počítač aj iPhone, iPad alebo iPod touch
  • Na iPhone alebo iPade prejdite naNastavenia> Safari> Pokročilé a zapnúť Webový inšpektor
  • V počítači otvorte Safari a prejdite naPonuka Safari> Predvoľby> Pokročilé a začiarknutie Zobraziť ponuku Vývoj na paneli s ponukami

Vyžaduje sa počítač Mac

Je nám ľúto, Windows, ale webový inšpektor Safari je kompatibilný iba s počítačmi Mac!

Používajte rovnaké Apple ID a iCloud Sync!

Uistite sa, že vaše iDevice aj váš Mac sú prihlásené s rovnakým Apple ID a že v iCloude prepínate ON Safari.

Pre vaše zariadenie iDevice:Nastavenia> Profil Apple ID> iCloud> Safari> zapnuté

Pre počítač Mac:Apple Menu> Systémové predvoľby> Apple ID alebo iCloud> Safari> Začiarknuté

A skontrolujte, či je Safari príliš rovnaká verzia

Uistite sa, že Safari na vašom Macu je rovnaká verzia ako Safari na vašom iDevice. Možno budete musieť aktualizovať svoju verziu iOS alebo verziu Safari spustenú na počítači Mac.

Obnovte svoju polohu a nastavenia súkromia

  1. Ísť do Nastavenia> Všeobecné
  2. Vyberte Resetovať
  3. Vyberte si Obnoviť polohu a súkromie

Tip na klávesovú skratku Pro Keyboard pre Mac pre webové vývojové zariadenia

Ak v prehliadači Safari stlačíte kombináciu klávesov CTRL + Command + R, výberom zariadenia môžete zistiť, ako by web vyzeral na konkrétnom zariadení.

Kliknutím na klávesovú skratku opustíte zobrazenie webového vývojára.

Na ladenie mobilného Safari použite webový inšpektor

1. Na svojom iPade, iPhone alebo iPod touch klepnite na Nastavenia> Safari> Pokročilé a zapnúť Webový inšpektor. A ak ešte nie je zapnutý, povoľte JavaScript

2. V počítači Mac spustite Safari a prejdite na Ponuka Safari> Predvoľby> Pokročilé potom skontrolujte „Zobraziť ponuku Vývoj na paneli s ponukami„Ak ste tak ešte neurobili

3. Pripojte zariadenie so systémom iOS k počítaču Mac pomocou kábla USB. To je kritické - musíte zariadenia pripojiť manuálne pomocou kábla. Nefunguje to cez WiFi!

4. Teraz na svojom iPade otvorte web, ktorý chcete ladiť, potom na svojom Macu otvorte Safari a choďte na „Rozvíjať" Ponuka. Teraz vidíte svoje zariadenie iDevice, ktoré ste pripojili k počítaču Mac. Ak vo svojom iDevice nemáte otvorenú žiadnu stránku, zobrazí sa správa „Žiadne kontrolovateľné aplikácie“.

5. Teraz nalaďte stránku otvorenú v mobilnom Safari rovnako, ako by ste ladili v Macu, skontrolujte prvky DOM, upravte CSS, zmerajte výkon stránky a spustite príkazy Javascript.

Použite nástroj debugger, ktorý vám pomôže nájsť príčinu akýchkoľvek chýb JavaScriptu na vašej webovej stránke. Môžete pridať hraničné hodnoty, odladiť javascript a skontrolovať hodnotu premenných za behu.

Safari by mal tiež zistiť chyby CSS, HTML a JavaScript. V ladiacom nástroji uvidíte podrobnosti o každej chybe.

iDevice sa nezobrazuje v ponuke Develop v Safari?

  • Vymažte vyrovnávaciu pamäť Safari a súbory cookie
  • Aktualizujte Safari na svojich počítačoch Mac a iDevice, ak je k dispozícii aktualizácia
    • Ak používate beta verziu pre iOS alebo macOS, bude pravdepodobne potrebné spustiť najnovšiu beta verziu na všetkých zariadeniach
  • Vyskúšajte na svojom Macu iný kábel alebo port. Uistite sa, že kábel je originálny bleskový kábel Apple alebo certifikovaný spoločnosťou MFI (vyrobený pre iPhone).
  • Skontrolujte, či je webový inšpektor zapnutý. Aktualizácie systému iOS to niekedy prepnú späť na predvolené nastavenie VYPNUTÉ. Takže to určite skontrolujteNastavenia> Safari> Pokročilé> Webový inšpektor
    • Skúste webového inšpektora vypnúť, počkajte 10 sekúnd a znova ho zapnite
  • Namiesto toho vyskúšajte prehliadač Safari Technology Preview
  • Ukončite Safari na vašom Macu a reštartujte ho. Zistite, či Safari vášho Macu potom rozpozná vaše zariadenie a umožní ladenie
  • Skontrolujte, či nepoužívate režim Súkromné ​​prehliadanie Safari, ak sa vaše zariadenie iDevice iba krátko zobrazí v ponuke Vývoj Safari a potom zmizne
  • Otvorte Monitor aktivity a skontrolujte, čo sa deje so Safari

Tipy pre čitateľov

  • Ak používate staršie zariadenie iDevice so systémom iOS 6 alebo starším, webový prehliadač Safari vášho zariadenia má vlastnú vstavanú ladiacu konzolu! Stačí prejsť do Debug konzoly Safari a prejsť nanastavenie > Safari > Vývojár > Ladiaca konzola

Posledné príspevky