Access-Control-Allow-Origin


#1

I need to add Access-Control-Allow-Origin to my headers so that I can use both fonts from Google Fonts and AWS S3/Cloudfront and not get this error …

Font from origin ‘https://media.domain.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://domain.com’ is therefore not allowed access.

But how? Where?

I am running the site on Ubuntu 16.04 x64 with Redis and Let’s Encrypt

Any ideas?


#2

Fixed it myself in the end.

Required domain,com in the Cloudfront permissions as well as the S3 bucket alias of media.domain,com due to javascript calling those assets directly.


#3

Hey @QloudPress would you be able to give some more info on how you fixed this problem? I’m using CloudFront (without S3) i’m just having trouble with 1 font file. I’ll keep at it anyway but any tips can help, thank you


#4

I got this working. For anyone else that comes across this and needs some help, I added the following to /etc/nginx/sites-enabled/mydomain.com (use nano or vim)

location ~* \.(eot|ttf|woff|woff2)$ {
add_header Access-Control-Allow-Origin "*";
}

sudo systemctl restart nginx


#5