0

I have this line in a css file of my project:

@import url(http://reset5.googlecode.com/hg/reset.min.css);

That results in an error when I load the page when it's on my webserver

XMLHttpRequest cannot load http://reset5.googlecode.com/hg/reset.min.css. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://mydomain.ca' is therefore not allowed access. The response had HTTP status code 403.

I've read that the server hosting the .css file has to add an Access-Control-Allow-Origin * thing on their web server but I'm not owning this so...

(I've also tried to add this

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

in my nginx config and it didn't help, but I don't think I have to change anything on my web server, do I?)

Pacane
  • 20,273
  • 18
  • 60
  • 97
  • You could try to add these other headers as well http://stackoverflow.com/questions/23915992 – Günter Zöchbauer Dec 10 '14 at 05:00
  • @GünterZöchbauer I'm not sure I follow you here. I'm using this import in a css file. And Nginx is managing my files, so I don't see how I can add header with dart client code..? – Pacane Dec 10 '14 at 13:22
  • I just wanted to make you aware that there are other CORS headers (shown in the linked question/answer). I think I misinterpreted your question a bit. If `reset5.googlecode.com` doesn't add CORS headers by itself, you are out of luck. This is what @Art Badger tried to point out. Copy the file to your own server and serve it using Nginx or to any other CDN that supports CORS. – Günter Zöchbauer Dec 10 '14 at 13:40

1 Answers1

2

This is a common error when the external file is not allowed to be accessed in some cases.

Instead of linking to the Google file, it would be better to host the file yourself, and link to it on your own server.

Download the file, and save in the css folder (or wherever you like), and then link to it using "link rel".

This will solve your problem.

Art Badger
  • 310
  • 1
  • 7