58

Is there a way to enable Cross-Origin Resource Sharing (CORS) for a static page hosted on GitHub Pages to allow cross-origin requests in Javascript?

For example, can we instruct GH Pages somehow to add these HTTP response headers:

Access-Control-Allow-Origin:*  
Access-Control-Allow-Methods:GET,POST
Access-Control-Max-Age: 1000
Access-Control-Allow-Headers:*

Couldn't find anything in their documentation, and this ...

...GitHub Pages does not support customer server configuration files such as .htaccess or .conf...

... doesn't sound very promising - or is there a way?

Max
  • 9,220
  • 10
  • 51
  • 83

5 Answers5

51

EDIT: Yay! Looks like GitHub Pages now supports CORS: https://twitter.com/invisiblecomma/status/575219895308324864

This can be verified by curling a request to enable-cors.org (which is hosted on GitHub Pages). Running this command: curl -v enable-cors.org > /dev/null returns an Access-Control-Allow-Origin: * header.

There's no way to support CORS on GitHub Pages, though I'd love to see this feature. We host http://enable-cors.org on GitHub Pages, and we can't enable CORS on the site itself :)

Update

As noted by @Styx GitHub Pages now always redirect to HTTPS. So if you want to confirm for yourself that all origins are allowed, for a particular site using GitHub pages, try curl with -L (to follow the redirects that are involved). E.g.:

$ curl -vL square.github.io/okhttp 2>&1 | fgrep -i access-control-allow-origin
George Hawkins
  • 37,044
  • 7
  • 30
  • 43
monsur
  • 45,581
  • 16
  • 101
  • 95
  • Thanks! Have you contacted GitHub or do you happen to know if they have any plans for this? – Max Oct 17 '14 at 11:01
  • 2
    I filed a feature request, but honestly this was a while ago, so I'll dig around again. David Jacquel makes a good point below, in that depending on the type of data you are serving, you could use a pure JS method, such as JSONP. This would require you to host your data as static files, but tools like Jekyll could help generate these files. – monsur Oct 17 '14 at 13:47
  • 2
    I don't think this answer is valid any longer. Based on this tweet: https://twitter.com/invisiblecomma/status/575219895308324864 GitHub staff member Ben Toews is credited with updating GitHub pages to include an open CORS header with ever response. This is easily verified by examining responses from enable-cors.org of any of the example Pages repos, as @abbr mentioned. Maybe monsur can update the answer for others that come looking...? :-) – Andrew Tomlinson Nov 22 '16 at 18:02
  • @AndrewTomlinson Thanks! I updated the answer accordingly. – monsur Nov 23 '16 at 20:30
  • 3
    At this point, I'm not seeing CORS headers returned, so the feature may have gone away. – Gregg Kellogg Apr 08 '17 at 23:14
  • @monsur this answer seems wrong again due to restrictions put in place, however I'm commenting to let you have first right to edit the answer back to saying it no if you prefer. It seems at best they have added some sort of small rate limited access. – whitneyland Dec 25 '18 at 23:59
  • 3
    @monsur It seems that GitHub allows it only for HTTPS pages now. Please, update your answer accordingly. – Styx Oct 13 '19 at 09:49
9

You can use a CORS proxy.
http://cors.io/ worked for me.

Normal request:

$.getJSON('https://blockchain.info/stats?format=json',function(data){})

Request with proxy (just prepend http://cors.io/? on the url)

$.getJSON('http://cors.io/?https://blockchain.info/stats?format=json',function(data){})

UPDATE: The API doc have been updated, you just need to prefix your url with https://cors.io/?.

Community
  • 1
  • 1
Victor
  • 5,043
  • 3
  • 41
  • 55
  • it's just `http://cors.io/?https://blockchain.info/stats?format=json` now (`http://cors.io/?`-prefixed) – YakovL Nov 25 '18 at 21:42
  • 9
    cors.io seems to have been dead since late 2019. If you google for CORS proxies you'll find that many have existed but none is backed by anyone major and none has survived particularly long. – George Hawkins Feb 24 '20 at 09:14
6

FYI it looks like GitHub Pages now support CORS (at least in some situations). In this case custom domains with bare URLs (no www or github sub domain). This means using an A record and avoiding their caching CDN.

When I go to enable-cors.org now I see the Access-Control-Allow-Origin: * header returned on all resources (from the network tab of the browser developer tools). In both Chrome and Firefox.

I use this at https://isthetubeonstrike.com to access a JSON file cross domain from a mobile web app. The SSL/TLS is provided by going through CloudFlare BTW.

James Singleton
  • 69
  • 1
  • 2
2

What I'm getting from having put in a support ticket a few days ago is that CORS requests to GitHub Pages are perfectly fine.

Getting content from another page, which is what the original post seems to be asking about, means that the other page's server has to have CORS requests set up or otherwise it will block your requests. Typically sites have public APIs to work around this issue if there is a real need to get content from them (e.g., MediaWiki for Wikipedia).

A13X
  • 409
  • 1
  • 6
  • 27
1

In my case, I was using a custom domain but I forgot to add the domain while deploying(ng deploy --base-href https://customdomain.com/). Check the network tab in dev-tools and observe the URL to check if it is generating the expected URL or not.

Gitesh kumar Jha
  • 189
  • 3
  • 9