No 'Access-Control-Allow-Origin' header is present

[HeroCC]

Hello! I recently emailed support about this and was told to make a ticket. Here is what it said:

I have a website that uses a custom grtp.co button that is supposed to show my receiving amount. However, it only works some of the time. It seems to only affect me, but I can't tell if it is the website or just a glitch with my profile. What the problem is, is that when you load my site via HTTPS I get this error: XMLHttpRequest cannot load https://gratipay.com/HeroCC/public.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://herocc.com' is therefore not allowed access. But when loading it via http it works as intended. I think it is just a bug with the https version of my public.json. The button is shown if you click the 'More' Button. It either says the Amount I receive with the Gratipay logo, or 'Gratipay' and the logo. If this is a problem on my end, let me know!

If anybody needs more information I can provide it. Thanks!

[chadwhitacre]

Thanks for reporting here, @HeroCC. :)

@rummik @techtonik Any chance to look into this?

[HeroCC]

I think I may have found something: The script looks for https://gratipay.com/HeroCC/public.json, which has the header on HTTPS, but on HTTP 302s to ~HeroCC/public.json, where it doesn't have the header. Hope this helps!

[techtonik]

@HeroCC, can you post the code that loads the json and exhibits the error condition to https://jsfiddle.net/? I tried to load it here - http://jsfiddle.net/5pjha/2090/ and it works.

[chadwhitacre]

@HeroCC The quickest workaround for you would be to update your script to use the (new) canonical URL for the resource:

https://gratipay.com/~HeroCC/public.json

You'll get one or more 302s from these alternate forms:

https://gratipay.com/HeroCC/public.json http://gratipay.com/~HeroCC/public.json http://gratipay.com/HeroCC/public.json

It looks like the way XmlHttpRequest and CORS work means that you don't have access to the response code and Location header if CORS doesn't match. If you did, you could follow the redirect. As it stands, it looks like we'd need to provide Access-Control-Allow-Origin: * on every step of a 302 chain in order for this to be transparent for you. I've reticketed that as https://github.com/gratipay/gratipay.com/issues/3583.

In the mean time, can you update your script to reference the new canonical URL?

[HeroCC]

Yay, thanks! I updated my script to use ~HeroCC rather than HeroCC and it works fine!

@techtonik My script didn't include the ~ before the name, so it failed. Using your example, doesn't matter if HTTPS of HTTP:

• http://jsfiddle.net/HeroCC/swz29h2z/6/ doesn't work
• http://jsfiddle.net/HeroCC/swz29h2z/5/ works

One I made using the grtp.co script, https doesn't work. Using ~ before the username fixes it:

• https://jsfiddle.net/HeroCC/jovrbbua/ doesn't work
• http://jsfiddle.net/HeroCC/jovrbbua/ works

Because I fixed my issue and you made the new ticket I will close this. If you need any more assistance in fixing this let me know!

[chadwhitacre]

Cool, thanks @HeroCC. :-)