Proč jeden obrázek selže, zatímco zbytek stránky se načte
Tři podmínky oddělují síťovou závadu od blokovaného požadavku a chyby vykreslení. Zjistěte, kterou URL prohlížeč zvolil, než změníte cestu.
Stránka se načte, text se vykreslí a jeden obrázek zůstane rozbitou ikonou. První reakce je vinit tunel, protože tunel je to, co se změnilo. Než to uděláte, zjistěte, kterou URL prohlížeč pro tento obrázek skutečně požadoval, protože URL stránky a URL obrázku jsou dva různé důkazy. Většina hlášení o chybějícím obrázku se nakonec týká hostitele, který nikdy nedostal funkční požadavek, a tato odpověď stojí jeden pohled na panel Síť.
O tom, kam se dívat, rozhodují tři podmínky
První podmínka je, zda obrázek pochází ze stejného hostitele jako stránka. Samostatný hostitel obrázků potřebuje vlastní překlad jmen, vlastní spojení a vlastní identitu TLS, takže stránka, která se načte, o něm nic neříká.
Druhá je, zda prohlížeč požadavek zablokoval ještě před odesláním. Smíšený obsah, politika zabezpečení obsahu a pravidla referreru mohou obrázek zastavit, aniž by vznikla běžná odpověď serveru, a proto se v seznamu neobjeví žádný neúspěšný požadavek.
Třetí je, zda doručení uspělo a vykreslení selhalo, tedy případ, kdy bajty dorazí a obrázek se přesto neobjeví. Tyto tři podmínky mají tři různé vlastníky a jen první z nich je síťová otázka.
| What you see | Where the fault sits |
|---|---|
| Request absent from the list | Markup, lazy loading or a policy that blocked it |
| Request failed or timed out | Resolution, route, TLS or the image host itself |
| Request returned 200, image blank | Response type, decoding or rendering |
Najděte zdroj, který prohlížeč skutečně zvolil
URL, kterou vidíte ve zdrojovém kódu stránky, často není URL, která byla požadována. Sady zdrojů, prvky picture a pozadí CSS umožňují prohlížeči zvolit jiný zdroj podle šířky zobrazované oblasti, hustoty pixelů nebo podpory formátu. Obrázek s líným načítáním nemusí být požadován vůbec, dokud stránka nedosáhne určitého stavu.
Prohlédněte prvek i požadavek společně a při hlášení problému ponechte iniciátora u požadavku. Přehled prvku img na MDN pokrývá výběr zdroje, chování při načítání i ovládání referreru na jednom místě, což stačí k určení, který atribut zvolil selhávající URL.
Zaznamenejte název hostitele, stav, případný řetězec přesměrování a typ obsahu odpovědi. Odpověď 200, která vrací přihlašovací stránku, není použitelný obrázek, a přesměrování na chybovou stránku HTML vypadá stejně jako poškozený soubor, dokud typ nepřečtete.
Přečtěte stav dřív než síť
Časový limit, odmítnutý požadavek a chyba dekódování vyžadují různé další kroky a stavový kód je tím, co je odděluje. Časový limit ukazuje na překlad jmen, trasu nebo hostitele, který neodpovídá. Odmítnutý požadavek ukazuje na politiku nebo autorizační vrstvu. Chyba dekódování ukazuje na bajty nebo formát.
Pokud se požadavek vůbec neobjeví, přestaňte sledovat síť a podívejte se na značkování. Nejčastější příčinou je záznam v sadě zdrojů, kterému prohlížeč dal přednost a který už na serveru neexistuje, následovaný prvkem, který skript nikdy nezviditelnil.
Právě toto rozlišení zabrání většině zbytečné práce u tohoto typu hlášení.
Když to prohlížeč zablokuje, není co číst
Smíšený obsah je klasický případ: stránka HTTPS, která žádá obrázek přes prosté HTTP, dostane požadavek zablokovaný, nikoli neúspěšný, a konzole zaznamená důvod. Politika zabezpečení obsahu vytváří stejný tvar a zablokovaná direktiva je uvedena ve zprávě. Politika referreru, která odstraní hlavičku, může také způsobit, že hostitel chráněný proti hotlinkingu vrátí zástupný obrázek místo skutečného.
Přečtěte zaznamenaný důvod, než se dotknete síťové cesty, protože tyto blokace se při změně trasy nezlepší. Přidání oprávnění mezi zdroji také není řešení: zobrazení obrázku z jiného hostitele a čtení jeho pixelů v canvasu jsou různé operace a pouze druhá potřebuje hlavičky, které lidé vkládají.
U webu, který spravujete, opravte URL zdroje, odpověď nebo politiku u jejího vlastníka a ponechte požadavky na autorizaci a referrer nedotčené. U webu, který nekontrolujete, pošlete stránku a důkazy o požadavku do jeho kanálu podpory, místo abyste znovu zveřejňovali soukromé odkazy na zdroje nebo odkazy, jejichž platnost končí.
Porovnávejte cesty, aniž byste měnili důkazy
Pokud chcete přístupovou cestu skutečně otestovat, držte vše ostatní konstantní: stejná stránka, stejný účet, stejný vybraný obrázek, jedna povolená cesta změněna. Porovnávejte záznamy požadavků vedle sebe, ne vykreslený výsledek, protože vykreslený výsledek říká, zda se obrázek objevil, ne proč.
Obrázek, který se načte na nové trase, nedokazuje, že je tato trasa autorizovaná, a obrázek, který zůstane rozbitý, nedokazuje, že je tunel na vině. Pokud byl obrázek odstraněn nebo je přístup záměrně omezen, použijte podporovanou alternativu, místo abyste vypínali kontroly certifikátů nebo kopírovali cizí chráněný materiál.
Pořadí práce: určete vybranou URL, přečtěte její stav a typ, zkontrolujte zaznamenaný důvod blokace a potom porovnávejte jednu změnu cesty po druhé.