Access-Control-Allow-Origin
n2nn2n opened this issue · 4 comments
I came across Skrollr and Skrollr-Stylesheets and finding that it's great. Very easy to work with and looks great.
Anyway, I just came across an Access-Control-Allow-Origin error from using Skrollr-Stylesheets with Google Fonts. When I leave out "skrollr-stylesheets.min.js", its fine again. Also, can only see the error using Chrome.
error:
XMLHttpRequest cannot load http://fonts.googleapis.com/css?family=Clicker+Script. Origin http://www.domain.com is not allowed by Access-Control-Allow-Origin. skrollr-stylesheets.min.js:2
Looking around to try and find a solution but I'm not having any luck. Do you know what might be happening?
Thx for the great work on all of this,
N2
never mind, I found the solution from another source.
using the google font link change rel='stylesheet' to rel='stylesheet prefetch'
Another hint: Just add the data-no-skrollr attribute to prevent skrollr-stylesheets from fetching it (https://github.com/Prinzhorn/skrollr-stylesheets#prevent-parsing). Because there won't be any keyframes inside these stylesheets.
In fact, by using rel="stylesheet prefetch" you didn't solve anything (see https://github.com/Prinzhorn/skrollr-stylesheets/blob/master/src/skrollr-stylesheets.js#L56). We're only fetching stylesheets with rel="stylesheet" (I need to update this check). So you're actually doing what data-no-skrollr would do. And If you leave it like that, it may break with a future version which does a proper check on the rel attribute.
A I said above, skrollr-stylesheets 0.0.2 works a bit different. Please read the changelog! https://github.com/Prinzhorn/skrollr-stylesheets#002
Great, thanks for the info.