If you’ve ever tried to host web fonts on a different domain you’ve probably run into the following errors in IE and Firefox:
Internet Explorer
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
CSS3117: @font-face failed cross-origin request. Resource access is restricted. |
Firefox
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
downloadable font: download failed (font-family: "MyFont" style:normal weight:normal stretch:normal src index:1): bad URI or cross-site access not allowed |
Usually this is a simple matter of updating your server with the Access-Control-Allow-Origin header. Unfortunately if you’re hosting your assets on Amazon S3 or CloudFront, editing the server config to add this isn’t possible.
This problem was originally posted to the AWS forums back in 2009… and a mere 3+ years later they finally released a fix.
Simply go to the Properties pane in the S3 Management Console and edit the CORS configuration. Here’s an example configuration:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<CORSConfiguration> | |
<CORSRule> | |
<AllowedOrigin>http://mydomain.com</AllowedOrigin> | |
<AllowedMethod>GET</AllowedMethod> | |
<MaxAgeSeconds>3000</MaxAgeSeconds> | |
<AllowedHeader>Authorization</AllowedHeader> | |
</CORSRule> | |
</CORSConfiguration> |
You can find more information about configuring CORS here: http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html#how-do-i-enable-cors
Reblogged this on Sutoprise Avenue, A SutoCom Source.