2 minutes reading time (384 words)

Set up CORS Headers for Static Content Pages Using Htaccess File

So you want to do something cross domain with javascript without running into the security error preventing cross domain nasties. Nasty hackers could easily plant some DOM manipulating javascript in your domain from theirs. Should be noted that trusted domains can also get compromised its an imperfect world. However at some point we have to enable some trust and we choose to do it perhaps with a particular domain or subdomain.

 

If you are thinking of using CORS instead of JSONP to achieve this which is the industry standard then your server will need to provide responses with the following header

Header set Access-Control-Allow-Origin: http://gamerdj.net.gridhosted.co.uk
 
This then is your control over external partners accessing javascript and in an htaccess file you can set this up with the following snippet.

<FilesMatch "\.(html)$">
FileETag None
<ifModule mod_headers.c>
Header set Access-Control-Allow-Origin: https://github.com
</ifModule>
</FilesMatch>

ALL html files will get served since it matches the regular expression at the point where the htaccess file sits in the folder structure.

If you are using wordpress or joomla or other CMS or similar then you will need to set the headers using php or .net and no doubt there will be a point where the system is setting their own headers - you might inject this header there however you don't really want to set the header for all pages which is the issue with a dynamic website. This is beyond the scope of what this simple article is here for. I didn't find a way to quickly test CORS with an html page so I am placing this here for others.

To get into detail about CORS then take a look here. They didn't cover setting the headers on the server like I have done above but its one of the best resources for understanding and has an example that I was able to get running.

That link also shows Angular JS in action whereby you can comment directly on videos in youtube using the youtube API. They are currently rejigging a lot of API stuff to fit better with their longer term roadmap concerning Google+ I feel that Google plus has the chance to replace facebook for business simply because the stuff you comment on share and upload in google plus appears in google. That doesn't happen for facebook.

 
 
Easy Sass Yeoman Grunt integration
Thoughts on my ideal role

Related Posts

 

Comments 1

admin (website) on Saturday, 22 February 2014 10:42

The advantages of using CORS is that you don't need to proxy in data (server side) for example using php curl [This then places the previously external domain effectively within your own domain]. As a CORS disadvantage you need the headers allowing your domain so it is useful for tight business relationships. You can specify * as a wildcard allowing all url's but this has security concerns as you are opening up removing the security set in place for a reason.

The advantages of using CORS is that you don't need to proxy in data (server side) for example using php curl [This then places the previously external domain effectively within your own domain]. As a CORS disadvantage you need the headers allowing your domain so it is useful for tight business relationships. You can specify * as a wildcard allowing all url's but this has security concerns as you are opening up removing the security set in place for a reason.
Already Registered? Login Here
Guest
Monday, 19 October 2020

Captcha Image

By accepting you will be accessing a service provided by a third-party external to https://cambs.eu/