Prečo jeden obrázok zlyhá, zatiaľ čo zvyšok stránky sa načíta
Tri podmienky oddeľujú sieťovú poruchu od zablokovanej požiadavky a od chyby vykreslenia. Nájdite URL, ktorú vybral prehliadač, skôr než zmeníte cestu.
Stránka sa načíta, text sa vykreslí a jeden obrázok zostane rozbitou ikonou. Prvá reakcia je obviniť tunel, pretože tunel je to, čo sa zmenilo. Predtým zistite, ktorú URL prehliadač pre tento obrázok skutočne požadoval, pretože URL stránky a URL obrázka sú dva rôzne dôkazy. Väčšina hlásení o chýbajúcom obrázku končí na hostiteľovi, ktorý nikdy nedostal funkčnú požiadavku, a táto odpoveď stojí jeden pohľad na panel Sieť.
O tom, kam sa pozerať, rozhodujú tri podmienky
Prvá podmienka je, či obrázok pochádza z rovnakého hostiteľa ako stránka. Samostatný hostiteľ obrázkov potrebuje vlastný preklad mien, vlastné spojenie a vlastnú identitu TLS, takže stránka, ktorá sa načíta, o ňom nič nehovorí.
Druhá je, či prehliadač požiadavku zablokoval ešte pred odoslaním. Zmiešaný obsah, politika zabezpečenia obsahu a pravidlá referrera môžu obrázok zastaviť bez bežnej odpovede servera, a preto sa v zozname neobjaví žiadna neúspešná požiadavka.
Tretia je, či doručenie uspelo a vykreslenie zlyhalo, teda prípad, keď bajty dorazia a obrázok sa napriek tomu neobjaví. Tieto tri podmienky majú troch rôznych vlastníkov a iba prvá je sieť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 |
Nájdite zdroj, ktorý prehliadač skutočne vybral
URL, ktorú vidíte v zdrojovom kóde stránky, často nie je URL, ktorá bola požadovaná. Sady zdrojov, prvky picture a pozadia CSS umožňujú prehliadaču vybrať iný zdroj podľa šírky zobrazovanej oblasti, hustoty pixelov alebo podpory formátu. Obrázok s lenivým načítaním nemusí byť požadovaný vôbec, kým stránka nedosiahne určitý stav.
Preskúmajte prvok a požiadavku spoločne a pri hlásení problému ponechajte iniciátora pri požiadavke. Prehľad prvku img na MDN pokrýva výber zdroja, správanie pri načítaní aj ovládanie referrera na jednom mieste, čo stačí na určenie, ktorý atribút vybral zlyhávajúcu URL.
Zaznamenajte názov hostiteľa, stav, prípadný reťazec presmerovaní a typ obsahu odpovede. Odpoveď 200, ktorá vracia prihlasovaciu stránku, nie je použiteľný obrázok, a presmerovanie na chybovú stránku HTML vyzerá rovnako ako poškodený súbor, kým typ neprečítate.
Prečítajte stav skôr než sieť
Časový limit, odmietnutá požiadavka a chyba dekódovania vyžadujú rôzne ďalšie kroky a stavový kód je to, čo ich oddeľuje. Časový limit ukazuje na preklad mien, trasu alebo hostiteľa, ktorý neodpovedá. Odmietnutá požiadavka ukazuje na politiku alebo autorizačnú vrstvu. Chyba dekódovania ukazuje na bajty alebo formát.
Ak sa požiadavka vôbec neobjaví, prestaňte sledovať sieť a pozrite sa na značkovanie. Najčastejšou príčinou je záznam v sade zdrojov, ktorému prehliadač dal prednosť a ktorý už na serveri neexistuje, nasledovaný prvkom, ktorý skript nikdy nezviditeľnil.
Práve toto rozlíšenie zabráni väčšine zbytočnej práce pri tomto type hlásení.
Keď to prehliadač zablokuje, nie je čo čítať
Zmiešaný obsah je klasický prípad: stránka HTTPS, ktorá žiada obrázok cez obyčajné HTTP, dostane požiadavku zablokovanú, nie neúspešnú, a konzola zaznamená dôvod. Politika zabezpečenia obsahu vytvára rovnaký tvar a zablokovaná direktíva je uvedená v správe. Politika referrera, ktorá odstráni hlavičku, môže tiež spôsobiť, že hostiteľ chránený proti hotlinku vráti zástupný obrázok namiesto skutočného.
Prečítajte zaznamenaný dôvod, kým sa dotknete sieťovej cesty, pretože tieto blokácie sa pri zmene trasy nezlepšia. Ani pridanie oprávnení medzi zdrojmi nie je riešením: zobrazenie obrázka z iného hostiteľa a čítanie jeho pixelov v canvas sú rôzne operácie a iba druhá potrebuje hlavičky, ktoré ľudia vkladajú.
Pri webe, ktorý spravujete, opravte URL zdroja, odpoveď alebo politiku u jej vlastníka a ponechajte požiadavky na autorizáciu a referrer nedotknuté. Pri webe, ktorý nekontrolujete, pošlite stránku a dôkazy o požiadavke do jeho kanála podpory, namiesto toho, aby ste znovu zverejnili súkromné odkazy na zdroje alebo odkazy, ktorých platnosť končí.
Porovnávajte cesty bez zmeny dôkazov
Ak chcete prístupovú cestu naozaj otestovať, držte všetko ostatné konštantné: rovnaká stránka, rovnaký účet, rovnaký vybraný obrázok, jedna povolená cesta zmenená. Porovnávajte záznamy požiadaviek vedľa seba, nie vykreslený výsledok, pretože vykreslený výsledok hovorí, či sa obrázok objavil, nie prečo.
Obrázok, ktorý sa načíta na novej trase, nedokazuje, že trasa je autorizovaná, a obrázok, ktorý zostane rozbitý, nedokazuje, že je na vine tunel. Ak bol obrázok odstránený alebo je prístup zámerne obmedzený, použite podporovanú alternatívu, namiesto vypnutia kontrol certifikátov alebo kopírovania cudzieho chráneného materiálu.
Poradie práce: určite vybranú URL, prečítajte jej stav a typ, skontrolujte zaznamenaný dôvod blokovania a potom porovnávajte jednu zmenu cesty za druhou.