Amazon S3に置いたWebフォントがFirefox, IEで表示されない現象の回避方法
今日調べて分かったのでメモ。 最近のFirefox, IEでは、クロスドメイン制約があるため、デフォルトでは異なるドメインのWebフォントを読み込めません。 サーバー側のレスポンスヘッダにAccess-Control-Allow-Originを指定すればいいのですが、Amazon S3の場合は以下のようにします。 S3 Management Console をブラウザで開いて、画面右の「CORS Configuration(下の図 赤丸の部分)」を 以下のように編集します: <CORSConfiguration> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <MaxAgeSeconds>3000</MaxAgeSeconds> <AllowedHeader>*</AllowedHeader> </CORSRule> </CORSConfiguration> これで、Webフォントが読み込まれるようになります。 参考: CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策 ｜ Developers.IO