HTTP / 2 Server Pu sh не работает для файлов JavaScript - PullRequest
Новая
       189

HTTP / 2 Server Pu sh не работает для файлов JavaScript

0 голосов
/ 08 мая 2020

Я пытаюсь реализовать HTTP / 2 Server Pu sh через CloudFlare Workers, используя приведенный ниже код: 

let mainScript='main-es2015.e66dc0bc532401d980dc.js';
response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script;");

Я также пробовал добавить crossorigin 

response.headers.append("Link", "</"+mainScript+">; rel=preload; as=script; crossorigin;");

Но это не работает.

В первом случае консоль разработчика показывает, что файл отправляется с сервера CloudFlare вместе с ответом html. но браузер не использует этот файл и делает дублирующий запрос на повторную загрузку файла.

Во втором случае консоль разработчика показывает, что браузер соблюдает предварительно загруженный заголовок, но содержимое файла не передается с сервера Cloudflare, и браузер должен сделать отдельный запрос для извлечения файла javascript, хотя он делает запрос сразу после получения файла html.

Я хочу, чтобы сервер cloudflare для pu sh файл и браузер, чтобы использовать этот отправленный файл без повторного запроса?

Удивительно, но приведенный ниже код отлично работает для css файлов: 

  response.headers.append("Link", "</styles.1d228f78d240e617dd5e.css>; rel=preload; as=style;");

, но не работает для любого другого содержимого, например javascript файлы шрифтов, изображения и т. Д. c.

Может ли кто-нибудь указать, что мне здесь не хватает?

1 Ответ

1 голос
/ 09 мая 2020

Как обсуждалось в автономном режиме, у вас было две проблемы:

Ваши шрифты дважды загружались вместо использования выталкиваемых версий

Шрифты нуждались в атрибуте crossorigin в заголовок ссылки или pu sh будут проигнорированы. См. Этот ответ: HTTP2-push-веб-шрифты не используются

Однако, даже когда вы добавили это, похоже, что Cloudflare прекратил отправку, поэтому, возможно, они этого не поддерживают.

Большинство ваших файлов JavaScript аналогичным образом дважды загружались вместо использования выталкиваемых версий

Это потому, что вы указывали их как модули: 

<script src="main-es2015.e66dc0bc532401d980dc.js" type="module"></script>

Вместо в виде простых файлов сценариев: 

<script src="main-es2015.e66dc0bc532401d980dc.js"></script>

Те, которые были успешно отправлены, не были определены как модули. Изменение заголовка ссылки на as="module", похоже, работает в Chrome, но этого нет в спецификации preload , а похоже, что альтернатива обсуждается , поэтому не уверен насколько это поддерживается и будет ли поддерживаться и впредь.

...