Как я могу исправить проблему веб-сайта «Отсутствующий перекрестный источник ресурсов (CORS)»?

По какой-то причине шрифты прекратили рендеринг на моих сайтах. Шрифты хранятся локально на том же сервере, что и сайт.

Я искал проблему, и, похоже, это Missing Cross-Origin Resource Sharing (CORS) Response Header но я не могу понять решение для этого.

Все различные сайты говорят, что нужно использовать: Access-Control-Allow-Origin:*

Но поскольку я в первую очередь перед собой, я не знаю, куда его поместить. С этим может помочь мой хозяин?

Что я могу сделать, чтобы исправить проблему?

РЕДАКТИРОВАТЬ:

данный сайт: http://cyclistinsuranceaustralia.com.au/

Например, номер телефона в правом верхнем углу должен быть шрифтом Bebas, но по умолчанию это значение Impact.

В консоли я получаю ошибки:

Шрифт от источника « http://www.cyclistinsuranceaustralia.com.au » был заблокирован от загрузки политикой совместного использования ресурсов Cross-Origin: заголовок «Access-Control-Allow-Origin» имеет значение « http: // www. cyclistinsuranceaustralia.com.au “, который не соответствует предоставленному происхождению. Поэтому «Origin» http://cyclistinsuranceaustralia.com.au ‘не допускается.

Я обращаюсь к своему хозяину, который сказал:

 Access-Control-Allow-Origin "http://www.cyclistinsuranceaustralia.com.au" 

в моем файле .htaccess, но это не изменилось.

В вашем HTML вы установили «базовый» тег:

  
  1. Удалите эту строку из своего HTML, если она вам не нужна. Это должно заставить шрифты работать, если смотреть с http://cyclistinsuranceaustralia.com.au .
  2. Вероятно, вам придется перенаправить http://www.cyclistinsuranceaustralia.com.au на http://cyclistinsuranceaustralia.com.au

Если вас просто интересует использование Access-Control-Allow-Origin:*

Вы можете сделать это с помощью этого файла .htaccess в корне сайта.

 Header set Access-Control-Allow-Origin "*" 

Некоторая полезная информация здесь: http://enable-cors.org/server_apache.html

Я собираюсь предположить, что ваш хост использует C-Panel – и это, вероятно, HostGator или GoDaddy. В обоих случаях они используют C-Panel (фактически, много хостов), чтобы сделать администрирование сервера максимально простым для вас, конечного пользователя. Даже если вы хостинг через кого-то другого – посмотрите, можете ли вы войти в какую-то панель администратора и найти файл .htaccess, который вы можете редактировать. (Примечание. Период до этого просто означает, что это «скрытый» файл / каталог).

Как только вы найдете файл htaccess, добавьте следующую строку:

  1. Header set Access-Control-Allow-Origin "*" Просто чтобы убедиться, что это работает. Предупреждение: не используйте эту строку на производственном сервере

Он должен работать. Если нет, позвоните своему хозяину и спросите их, почему линия не работает – они, вероятно, смогут быстро помочь вам.

  1. После того, как вы выполните вышеуказанное рабочее изменение * на адрес запрашивающего домена http://cyclistinsuranceaustralia.com.au/ . Вы можете найти проблему с канонической адресацией (включая www), и если вам может понадобиться настроить хост для перенаправления. Это другой и меньший мост, чтобы пересечь, хотя. Вы, по крайней мере, будете в нужном месте.

В вашем конкретном случае проблема, похоже, связана с доступом к сайту из неканонического URL (www.site.com vs. site.com).

Вместо исправления проблемы CORS (для которой может потребоваться запись прокси-сервера на серверные шрифты с соответствующими заголовками CORS в зависимости от поставщика услуг), вы можете нормализовать свои URL-адреса для всегда содержимого сервера на каноническом Url и просто перенаправлять, если запрашивать страницу без «www.».

В качестве альтернативы вы можете загружать шрифты на разные серверы / CDN, которые, как известно, имеют настроенные заголовки CORS, или вы можете легко это сделать.

у нас была аналогичная проблема с заголовком, когда Amazon (AWS) S3 назначил сообщение «Ошибка» в некоторых браузерах.

точка должна была указать ведро CORS, чтобы открыть заголовок Access-Control-Allow-Origin

подробнее в этом ответе: https://stackoverflow.com/a/37465080/473040

У нас была эта точная проблема с fontawesome-webfont.woff2, в результате чего была ошибка 406 на общем хосте (Cpanel). Я работал над неуловимым «доменом без файлов cookie» для проекта WordPress Multisite, и мои страницы «www.domain.tld» имели бы следующую ошибку (3 раза) в Chrome:

Шрифт из источника « http: //static.domain.tld » был заблокирован при загрузке политикой совместного использования ресурсов Cross-Origin: заголовок «Access-Control-Allow-Origin» присутствует на запрошенном ресурсе. Происхождение ‘ http: //www.domain.tld ‘, следовательно, не допускается.

и в Firefox, немного подробнее:

загружаемый шрифт: загрузка не удалась (font-family: «FontAwesome» style: normal weight: normal stretch: normal src index: 1): неправильный URI или межсайтовый доступ не разрешен источник: http: //static.domain.tld/wp -поперечник / темы / некоторые-тематический здесь / шрифты / fontawesome-webfont.woff2? v = 4.7.0
font-awesome.min.css: 4: 14 Запрос на перекрестный запрос заблокирован: политика одинакового происхождения запрещает чтение удаленного ресурса по адресу http: //static.domain.tld/wp-content/themes/some-theme-here/fonts /fontawesome-webfont.woff?v=4.7.0 . (Причина: заголовок CORS «Access-Control-Allow-Origin» отсутствует).

Я добрался до QWANT-around (QWANT.com = фантастический) и нашел это сообщение SO:

Поддомены, порты и протоколы подстановки под контролем доступа-Разрешения-Origin

Час в чате с различным персоналом поддержки общего хоста (никто даже не знал о F12 в браузере …), а затем ожидал ответа на билет, который был разрезан без радости во время игры с mod_security. В то же время я попытался скопировать код файла .htaccess вместе с сообщением и получил это, чтобы исправить ошибки 406, безупречно:

    SetEnvIf Origin "http(s)?://(.+\.)?domain\.tld(:\d{1,5})?$" CORS=$0 Header set Access-Control-Allow-Origin "%{CORS}e" env=CORS Header merge Vary "Origin"   

Я добавил это к началу моего .htaccess в корне сайта, и теперь у меня есть новый дядя по имени Боб. (***, конечно, измените части domain.tld на то, что ваш домен, с которым вы работаете, …)

Моя ИЗБРАННАЯ часть этого сообщения, хотя это возможность RegEx OR (|) нескольких сайтов в этом CORS «взломать», делая:

Чтобы разрешить несколько сайтов:

 SetEnvIf Origin "http(s)?://(.+\.)?(othersite\.com|mywebsite\.com)(:\d{1,5})?$" CORS=$0 

Это исправление, честно говоря, взорвало мой разум, потому что я столкнулся с этим вопросом раньше, работая с Dev в Fortune 500 компаниями, которые являются MILES выше моей базы знаний Apache, и не мог решить такие проблемы, не заставляя IT настраивать настройки Apache.

Это своего рода волшебная пуля, которая устраняет все эти проблемы CDN с доменами cookie-less (или почти без файлов cookie, если вы используете CloudFlare …), чтобы уменьшить количество ненужного веб-трафика из файлов cookie, которые отправляются только с каждым запросом изображения чтобы быть отброшены, как плохой слепой дата на сервере.

Super Secure, Super Elegant. Полюбите его: вам не нужно открывать пропускную способность ваших серверов для типов ресурсов воров / горячих ссылок.

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

@Noyo https://stackoverflow.com/users/357774/noyo

@DaveRandom https://stackoverflow.com/users/889949/daverandom

@ pratap-koritala https://stackoverflow.com/users/4401569/pratap-koritala

Interesting Posts
Давайте будем гением компьютера.