Как запросить файл gzip javascript у AWS CloudFront и S3 - PullRequest
Новая
       19

Как запросить файл gzip javascript у AWS CloudFront и S3

1 голос
/ 23 февраля 2020

Я хочу оптимизировать размер пакета моего сайта с помощью сжатия. Для начала я использую webpack и плагин сжатия-веб-пакета для создания файла gizp из моего скомпилированного javascript. Все мои активы размещены на S3 и обслуживаются через CloudFront. Также новый для этого вида оптимизации. 

new CompressionPlugin({
 test: /\.js(\?.*)?$/i,
 filename: "[path].gz[query]",
 algorithm: "gzip",
})

мой ведро s3. выглядит так: 

bucket /
 index.html
 main-92540b8c5cf0e7107a73.js.gz

выше js .gz файл имеет набор полей метаданных «content-encoding: gzip». Размер запроса составляет 86,0 КБ

Конфигурация S3 CORS 

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Authorization</AllowedHeader>
    <AllowedHeader>Content-Length</AllowedHeader>
</CORSRule>
</CORSConfiguration>

index. html ищет этот 

<script type="text/javascript" src="/main-92540b8c5cf0e7107a73.js"></script>

В моем дистрибутиве CloudFront для объектов Compress автоматически установлено значение Compress. правда. Хотя я уверен, что это необходимо, поскольку мой файл уже сжат.

Со всем этим набором я вижу эту ошибку в своей консоли для моего js .file 

Uncaught SyntaxError: Unexpected token '<'

Если я проверьте мои заголовки запросов и ответов, они выглядят как

enter image description here

Я считаю, что проблема, с которой я сталкиваюсь, заключается в том, что отсутствует Accept-Encoding: заголовок gzip установить в моей просьбе. Но мне неясно, как мне его добавить.

У меня вопрос, я прав насчет отсутствующего заголовка? или есть что-то еще, что я пропустил в этом?

1 Ответ

0 голосов
/ 26 февраля 2020

Я смог это исправить, удалив расширение .gz в моих сжатых файлах. Также добавлен заголовок длины содержимого в мою конфигурацию cors для s3 buckets

...