Какие ограничения применяются к непрозрачным ответам?

Непрозрачные ответы определяются как часть API Fetch API и представляют собой результат запроса в удаленном источнике, когда CORS не включен.

Какие практические ограничения и "gotchas" существуют вокруг того, как непрозрачные ответы могут использоваться как из JavaScript, так и как ресурсы на странице?

Ответ 1

Доступ к заголовкам/телу непрозрачных ответов

Самое прямое ограничение вокруг непрозрачных ответов заключается в том, что вы не можете получить значимую информацию из большей части свойств класса Response, например headers или вызовите различные методы , которые составляют интерфейс Body, например json() или text(). Это соответствует черному ясности непрозрачного ответа.

Использование непрозрачных ответов в качестве ресурсов на странице

Непрозрачные ответы могут использоваться как ресурс на веб-странице всякий раз, когда браузер разрешает использовать ресурс кросс-источника. Здесь подмножество элементов, для которых ресурсы перекрестного происхождения и, следовательно, непрозрачные ответы, действительны, адаптированы из документации Mozilla Developer Network:

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

Известный прецедент, для которого непрозрачные ответы не действительны для ресурсов шрифта.

В целом, чтобы определить, можете ли вы использовать непрозрачный ответ как определенный тип ресурса на странице, проверьте соответствующую спецификацию. Например, в спецификации HTML объясняется, что кросс-исходные (то есть непрозрачные) ответы могут использоваться для элементов <script>, хотя с некоторыми ограничениями для предотвращения утечка информации об ошибке.

Непрозрачные ответы и API хранения кэшей

Один "полученный", который разработчик может работать в с непрозрачными ответами, использует их с API кэширования хранилища. Имеются две части справочной информации:

  • status свойство непрозрачного ответа всегда устанавливается на 0, независимо от того, был ли исходный запрос успешным или неудачным.
  • API хранения кэша add()/addAll() будут отклоняться, если ответы, полученные в результате любого из запросов, имеют код состояния, который не находится в диапазон 2XX.

Из этих двух точек следует, что если запрос, выполняемый как часть вызова add()/addAll(), вызывает непрозрачный ответ, он не будет добавлен в кеш.

Вы можете обойти это, явно выполнив fetch(), а затем вызовите метод put() с непрозрачным ответом. Поступая таким образом, вы эффективно решаете, что ответ, который вы выполняете, может быть ошибкой, возвращаемой вашим сервером.

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));

Непрозрачные ответы и API navigator.storage

Во избежание утечки кросс-доменной информации значительное добавление добавляется к размеру непрозрачного ответа, используемого для вычисления пределов квот на хранение (т.е. исключается ли исключение QuotaExceeded) и сообщается navigator.storage API.

Сведения об этом дополнении варьируются от браузера к браузеру, но для Google Chrome это означает, что минимальный размер, который может оказать один общий кешированный непрозрачный ответ на общее использование хранилища, около 7 мегабайт. Вы должны помнить об этом при определении количества непрозрачных ответов, которые вы хотите кэшировать, поскольку вы могли бы легко превысить ограничения на квоты хранилища намного раньше, чем вы ожидали бы, исходя из фактического размера непрозрачных ресурсов.