2017-02-07 3 views
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> 

これをデバッグ/解決するには、どのような方法が適していますか?

+0

私が理解しているように、あなたは.htaccessをWordPress側に置いていますよね?しかし、フォントが置かれている "サーバー"側にあるはずです。 CORSによれば、リソース(フォント)の所有者はクライアントサーバー(WordPressサイト)にアクセス権を与えます。 –

+0

ありがとう@KAGGDesign、私はこれを初めて知っていてとてもうまく説明できません。私が理解しているように、Wordpressのサイト*はサーバーです。 CDNの起源はWordpressのサイトです。たとえば、私がS3バケットにフォントをホストしていた場合、そのバケットにアクセスポリシーを追加するのは比較的簡単です。しかしWPサイトが起源であるので、私は物事をどのように構成するかについては不明です。 –

+0

Safariが問題なくフォントをロードすることも奇妙である –

答えて

0

グーグルで実験した結果、新しいサーバーでmod_headersモジュールを有効にする必要があることが判明しました。

sudo a2enmod headers 
sudo service apache2 reload 

将来的に誰か他の頭痛を救うためにここに投稿してください。

関連する問題