programing

CORS 정책에 의해 오리진에서 글꼴에 대한 액세스가 차단되었습니다.요청한 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.

bestprogram 2023. 10. 14. 10:26

CORS 정책에 의해 오리진에서 글꼴에 대한 액세스가 차단되었습니다.요청한 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.

제 웹사이트에 두 가지 문제가 있습니다.

1) 혼합 콘텐츠:'https://www.mywebsite.com/' 의 페이지가 HTTPS를 통해 로드되었지만 'http://demo.kallyas.net/ares-furniture-interior-design/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff' '의 안전하지 않은 글꼴을 요청했습니다. 이 콘텐츠는 HTTPS를 통해서도 제공되어야 합니다.

2) CORS 정책에 의해 'https://kallyas.net/demo-ares/furniture/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff' '에서 'https://www.mywebsite.com '의 글꼴에 대한 액세스가 차단되었습니다.

요청한 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.

시도해 본 결과:

<IfModule mod_rewrite.c>
Header set Access-Control-Allow-Origin "*"
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

&

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET,PUT,POST,DELETE"
Header set Access-Control-Allow-Headers "Content-Type, Authorization"

코드를 당신의 .htaccess 파일에 넣고 시도해보세요.

<IfModule mod_headers.c>
   Header set Access-Control-Allow-Origin "*"
</IfModule>
<FilesMatch ".(eot|ttf|otf|woff)">
   Header set Access-Control-Allow-Origin "*"
</FilesMatch>

브라우저가 특정 리소스(폰트, 이미지 등)를 가져올 수 있도록 지시하는 서버의 응답에 특정 헤더를 추가할 수 있습니다..htaccess서버 루트 폴더의 파일(또는 웹 사이트가 있는 위치)

<IfModule mod_headers.c>
  <FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css)$">
     Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>

regex선(ttf|ttc|otf|eot|woff|woff2|font.css)는 이러한 확장자가 있는 파일과 "font"로 시작하여 "css"로 끝나는 모든 CSS 파일을 제공할 때 이 헤더를 응답에 추가한다는 것을 의미합니다(점은 탈출되지 않았기 때문에 모든 문자를 나타냄).

제 경험으로는 이것이 문제를 해결하는 가장 효과적이고 간단한 방법입니다.

언급URL : https://stackoverflow.com/questions/56273924/access-to-font-at-from-origin-has-been-blocked-by-cors-policy-no-access-contro