Ошибка CORS при попытке загрузки пользовательского шрифта

Разработка
1

Я пытаюсь использовать специальный шрифт в одном из компонентов моей темы. Я следовал инструкциям в этом посте:

Вот CSS в моем компоненте:

@font-face {
  font-family: 'northwood';
  font-style: regular;
  src: url($northwoodhigh) format('woff2');
}

.category-list tbody .category h3 a[href] {
	color: #ccc;
	font-family: 'northwood', cursive;
	font-size: 135%;
	word-spacing: 3px;
}

Я добавил свой URL Cloudfront в настройки CORS следующим образом:

Image 2020-04-25 at 6.45.23 PM
Image 2020-04-25 at 6.45.23 PM600×143 18.7 KB

Но это не работает — к сожалению, при загрузке страницы с этим CSS в консоли я получаю ошибку «Cross-origin request blocked»:

7d26013f5bcde40cc8778378940e1e53_Image 2020-04-25 at 6.38.04 PM

(Извините за очень маленькое изображение.) Есть ли у кого-нибудь какие-либо советы? Я в тупике.

3

Указана ли переменная DISCOURSE_ENABLE_CORS в вашем файле app.yml, как рекомендуется в описании?

4

Не уверен — есть ли способ проверить? (Я использую размещенный экземпляр Discourse, поэтому не могу напрямую просмотреть файлы конфигурации.)

Редактирование: Я отправил письмо нашему хостинг-провайдеру, чтобы выяснить, не в этом ли проблема.

5

Обновление: мой хостинг-провайдер подтверждает, что DISCOURSE_ENABLE_CORS установлен в значение TRUE.

Так что я всё ещё в недоумении.

7

Я только что попробовал это, точно так же, как вы описали, на сайте с настроенным CDN, и всё сработало. Так что, думаю, проблема может быть ограничена вашим сайтом.

Я считаю, что настройка DISCOURSE_ENABLE_CORS работает в обратном порядке от того, что вам нужно. Добавление доменов в эту настройку позволит запросам с этих доменов получать доступ к вашему домену Discourse, а не наоборот.

Вам же нужно разрешить запросы с вашего домена Discourse для получения доступа к файлу на вашем CDN. Похоже, ваш CDN блокирует эти запросы. Вы можете это подтвердить, запустив в терминале что-то вроде этого, конечно, после того как измените значения.

curl -H "origin: YOUR_SITE_URL" -v "PATH_TO_THE_FONT_ON_YOUR_CDN"

Если всё настроено правильно, в заголовках ответа вы должны увидеть что-то вроде этого:

Access-Control-Allow-Origin: *