Веб-шрифты не кэшируются в Cloudfront - PullRequest
Новая
       10

Веб-шрифты не кэшируются в Cloudfront

0 голосов
/ 08 января 2019

Мы пытаемся разместить все наши файловые активы на s3 и cloudfront, чтобы уменьшить нагрузку на наш сервер. Практически все типы файлов работают нормально, а Cloudfront кэширует файлы. Для файлов шрифтов, кажется, всегда есть промах. Что я делаю не так?

Когда мы впервые включили шрифты и вызвали их, мы получили ошибку, которая указала на проблему с протоколом CORS. Здесь мы узнали о CORS.

Мы следовали этому решению, Amazon S3 CORS (Cross-Origin Resource Sharing) и междоменная загрузка шрифтов Firefox

Вот мои настройки CORS. Мы должны использовать AllowedOrigion в качестве подстановочного знака, потому что мы поддерживаем множество веб-сайтов. 

<?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>Content-*</AllowedHeader>
    <AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>

Я устанавливаю правила поведения в распределении облачного фронта для каждого типа шрифта: /*.ttf

с заголовками белого списка в начало

Я проверил с помощью curl, и всегда есть промах, а access-control-allow-origin всегда *

curl -i -H "Происхождение: https://www.example.com" https://path/to-file/font-awesome/fonts/fontawesome-webfont.woff

HTTP/2 200
content-type: binary/octet-stream
content-length: 98024
date: Tue, 08 Jan 2019 09:07:03 GMT
access-control-allow-origin: *
access-control-allow-methods: GET
access-control-max-age: 3000
last-modified: Mon, 07 Jan 2019 08:44:46 GMT
etag: "fee66e712a8a08eef5805a46892932ad"
accept-ranges: bytes
server: AmazonS3
vary: Origin
x-cache: Miss from cloudfront
via: 1.1 d76fac2b5a2f460a1cbffb76189f59ef.cloudfront.net (CloudFront)
x-amz-cf-id: 1azzRgw3h33KXW90xyPMXCTUAfZdXjCb2osrSkxxdU5lCoq6VNC7fw==

Я должен также упомянуть, что когда я иду непосредственно к файлу, который он загружает, а не открывается в браузере (что может быть правильным поведением, не уверен).

Файлы загружаются сегодня, и это хорошо, но, в конце концов, я бы хотел, чтобы Cloudfront отправлял файлы, когда они есть в кэше, а не всегда отсутствовал.

1 Ответ

0 голосов
/ 08 января 2019

Ваш дамп Curl указывает, что в ответе нет заголовков "cache-control". Этот заголовок должен быть установлен (https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Expiration.html). Рекомендуется установить контроль кэша cc "public, max-age = xxx, s-maxage = yyy" (xxx = время кэшируется в браузере пользователя, yyy время кэшируется в CDN).

У вас есть этот заголовок для других ресурсов (например, css или js), а не для woff?

Проверьте это: как добавить управление кэшем в AWS S3?

...