Solved: S3に置いたWEBフォントが、別サイトで読み込めない

Font from origin ‘https://hoge-bucket.s3.amazonaws.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://hogehuga.com’ is therefore not allowed access.

① WEBフォント ( あるいはバケット / ディレクトリ ) が公開設定になってることを確認
→ なってないとそもそも上記エラーではなく404とかがでる

② S3のバケット一覧へアクセスし、該当のバケットのプロパティを表示。プロパティを表示すると画像のような表示が見えるので、アクセス許可のメニューを展開し、CORS設定の編集を選択。

③ 下記のように変更すれば CORS が有効になり, 別ドメインでも参照することができるようになります

④ 使うドメインを追記しとく

以上です〜〜〜

https://nixeneko.hatenablog.com/entry/2016/10/11/231435
http://sora33.hatenadiary.com/entry/2016/06/02/001250
http://phiary.me/s3-cors-setting/