CORS Проблема со шрифтами woff2 за CDN в Chrome

У меня есть S3 Bucket с облачным фронтом CDN. В этой корзине у меня есть несколько шрифтов woff2, которые были автоматически помечены с типом контента octet-stream, При попытке загрузить этот шрифт из файла CSS на работающем производственном веб-сайте я получаю следующую ошибку:

Access to Font at 'https://cdn.example.com/fonts/my-font.woff2' from origin 
'https://www.live-website.com' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'https://www.live-website.com' is therefore not allowed access.

Дело в том, что завиток показывает, что Access-Control-Allow-Origin настоящее:

HTTP/1.1 200 OK
Content-Type: binary/octet-stream
Content-Length: 98488
Connection: keep-alive
Date: Wed, 08 Aug 2018 19:43:01 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET
Access-Control-Max-Age: 3000
Last-Modified: Mon, 14 Aug 2017 14:57:06 GMT
ETag: "<redacted>"
Accept-Ranges: bytes
Server: AmazonS3
Age: 84847
X-Cache: Hit from cloudfront
Via: 1.1 <redacted>
X-Amz-Cf-Id: <redacted>

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

2 ответа

Оказывается, что проблема была на самом деле с Content-Type, Как только я изменил тип контента на application/font-woff2 и аннулировал кеш этих woff2 файлы, все прошло гладко.

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

Другие вопросы по тегам