Мы пытаемся разместить все наши файловые активы на 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 обслуживал файлы, когда они есть в кэше, а не всегда отсутствовали.
Ваш дамп 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?
Других решений пока нет …