htaccess Access-Control-Allow-Origin

I'm creating a script that loads externally on other sites. It loads CSS and HTML and works fine on my own servers.

However, when I try it on another website it displays this awful error:

Access-Control-Allow-Origin

Here you can see it loads perfectly: http://tzook.info/bot/

But on this other website it shows the error: http://cantloseweight.co/robot/

I uploaded the loading script to jsfiddle: http://jsfiddle.net/TL5LK/

I tried editing the htaccess file like this:

<IfModule mod_headers.c>    
    Header set Access-Control-Allow-Origin *
</IfModule>

Or like this:

Header set Access-Control-Allow-Origin *

But it still doesn't work.


Try this in the .htaccess of the external root folder :

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

And if it only concerns .js scripts you should wrap the above code inside this:

<FilesMatch "\.(js)$">
...
</FilesMatch>

no one says that you also have to have mod_headers enabled, so if still not working, try this:

(following tips works on Ubuntu, don't know about other distributions)

you can check list of loaded modules with

apache2ctl -M

to enable mod_headers you can use

a2enmod headers

of course after any changes in Apache you have to restart it:

/etc/init.d/apache2 restart

Then you can use

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

And if mod_headers is not active, this line will do nothing at all. You can try skip if clause and just add Header set Access-Control-Allow-Origin "*" in your config, then it should throw error during start if mod_headers is not active.


from my experience;

if it doesn't work from within php do this in .htaccess it worked for me

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin http://www.vknyvz.com  
    Header set Access-Control-Allow-Credentials true
</IfModule>
  • credentials can be true or false depending on your ajax request params

Add an .htaccess file with the following directives to your fonts folder, if have problems accessing your fonts. Can easily be modified for use with .css or .js files.

<FilesMatch "\.(eot|ttf|otf|woff)$">
    Header set Access-Control-Allow-Origin "*"
</FilesMatch>

In Zend Framework 2.0 i had this problem. Can be solved in two way .htaccess or php header i prefer .htaccess so i modified .htaccess from:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]

to

RewriteEngine On

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]

and it start to work