1
私は(Wordpress)サイトを新しいホスティング場所に移行しました。CORSポリシーのためにChrome/FFブロックCDNフォントを防止する方法は?
サイトは完全に機能しますが、ChromeとFirefoxでは特定のフォントが表示されません。
Access to Font at 'http://example.com/site/wp-content/themes/mytheme/fonts/modules.ttf'
from origin 'http://example.com' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://example.com' is therefore not allowed access.
私はCloudfrontを使用してフォントを提供しています(S3ではなくexample.comを起点として使用しています)。 Wordpressの.htaccessには次の内容が含まれています:
<IfModule mod_headers.c>
<FilesMatch "\.(eot|font.css|otf|ttc|ttf|woff)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>
<IfModule mod_mime.c>
# Web fonts
AddType application/font-woff woff
AddType application/vnd.ms-fontobject eot
AddType application/x-font-ttf ttc ttf
AddType font/opentype otf
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
</IfModule>
これをデバッグ/解決するには、どのような方法が適していますか?
私が理解しているように、あなたは.htaccessをWordPress側に置いていますよね?しかし、フォントが置かれている "サーバー"側にあるはずです。 CORSによれば、リソース(フォント)の所有者はクライアントサーバー(WordPressサイト)にアクセス権を与えます。 –
ありがとう@KAGGDesign、私はこれを初めて知っていてとてもうまく説明できません。私が理解しているように、Wordpressのサイト*はサーバーです。 CDNの起源はWordpressのサイトです。たとえば、私がS3バケットにフォントをホストしていた場合、そのバケットにアクセスポリシーを追加するのは比較的簡単です。しかしWPサイトが起源であるので、私は物事をどのように構成するかについては不明です。 –
Safariが問題なくフォントをロードすることも奇妙である –