Jakie ograniczenia dotyczą nieprzejrzystych odpowiedzi?

Nieprzezroczyste odpowiedzi są definiowane jako część interfejsu API pobierania i reprezentują wynik żądania wysłanego do zdalnego źródła, gdy mechanizm CORS nie jest włączony.

Jakie praktyczne ograniczenia i „pułapki” istnieją wokół tego, jak można używać nieprzejrzystych odpowiedzi, zarówno z języka JavaScript, jak i jako zasobów na stronie?

Dostęp do nagłówków / treści nieprzejrzystych odpowiedzi

Najprostszym ograniczenie wokół nieprzezroczystych odpowiedzi jest to, że nie można uzyskać informację o znaczącej powrotnej z większości właściwości w Responseklasie, jak headers, lub zadzwoń do różnych metod , które tworzą Bodyinterfejs, jak json()i text(). Jest to zgodne z czarnoskrzynkową naturą nieprzejrzystej odpowiedzi.

Używanie nieprzejrzystych odpowiedzi jako zasobów na stronie

Nieprzezroczyste odpowiedzi mogą służyć jako zasób na stronie sieci Web, ilekroć przeglądarka zezwala na użycie zasobu innego pochodzenia niż CORS. Oto podzbiór elementów, dla których poprawne są zasoby pochodzące z innych źródeł niż CORS, a tym samym nieprzezroczyste odpowiedzi, zaadaptowane z dokumentacji Mozilla Developer Network :

• <script>
• <link rel="stylesheet">
• <img>, <video>i<audio>
• <object> i <embed>
• <iframe>

Godnym uwagi przypadek użycia, dla których odpowiedzi są nieprzezroczyste nie ważne jest dla zasobów czcionek .

Ogólnie, aby określić, czy można użyć nieprzejrzystej odpowiedzi jako określonego typu zasobu na stronie, należy sprawdzić odpowiednią specyfikację. Na przykład specyfikacja HTML wyjaśnia, że dla <script>elementów mogą być używane krzyżowe odpowiedzi inne niż CORS (tj. Nieprzezroczyste) , chociaż z pewnymi ograniczeniami, aby zapobiec wyciekaniu informacji o błędach.

Nieprzezroczyste odpowiedzi i interfejs API pamięci podręcznej

Jednym z problemów, na które programiści mogą napotkać nieprzejrzyste odpowiedzi, jest używanie ich z Cache Storage API . Istotne są dwie podstawowe informacje:

• statusWłasnością nieprzezroczystej odpowiedź jest zawsze ustawiony0 , niezależnie od tego, czy oryginalny wniosek udało, czy nie.
• Obie metody add()/ addAll()metody Cache Storage API będą odrzucać, jeśli odpowiedzi wynikające z któregokolwiek z żądań mają kod stanu spoza zakresu 2XX .

Z tych dwóch punktów wynika, że ​​jeśli żądanie wykonane jako część wywołania add()/ addAll()spowoduje nieprzezroczystą odpowiedź, nie zostanie ono dodane do pamięci podręcznej.

Możesz obejść ten problem, jawnie wykonując a, fetch()a następnie wywołując put()metodę z nieprzezroczystą odpowiedzią. W ten sposób skutecznie akceptujesz ryzyko, że buforowana odpowiedź mogła być błędem zwróconym przez serwer.

const request = new Request('https://third-party-no-cors.com/', {mode: 'no-cors'});
// Assume `cache` is an open instance of the Cache class.
fetch(request).then(response => cache.put(request, response));

Nieprzezroczyste odpowiedzi i interfejs API navigator.storage

Aby uniknąć wycieku informacji międzydomenowych, do rozmiaru nieprzezroczystej odpowiedzi używanej do obliczania limitów przydziału pamięci (tj. Czy QuotaExceededzgłaszany jest wyjątek) i zgłaszanych przez navigator.storageAPI, dodano znaczące wypełnienie .

Szczegóły tego wypełnienia różnią się w zależności od przeglądarki, ale w przypadku Google Chrome oznacza to, że minimalny rozmiar, jaki każda pojedyncza nieprzezroczysta odpowiedź w pamięci podręcznej przyczynia się do ogólnego wykorzystania pamięci, wynosi około 7 megabajtów . Należy o tym pamiętać podczas określania liczby nieprzezroczystych odpowiedzi, które mają być buforowane, ponieważ można łatwo przekroczyć ograniczenia przydziału magazynu znacznie wcześniej, niż można by się spodziewać w oparciu o rzeczywisty rozmiar nieprzezroczystych zasobów.