How to add CORS (cross origin policy) to all domai

Question

I have created a folder that will be used for serving static files (CSS, images, fonts and JS etc) I will eventually CNAME the folder into a subdomain for usage on a CDN to work with my Magento 2 setup.

I want to allow ALL domains ALL access via CORS - Cross Origin Policy and I want to cache the data too. This is what I have. (I am not asking for security suggestions or tips on JSONP issues - I want global access to the file directory please)

location /cdn-directory/ {

    location ~* \.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2|zip|gz|gzip|bz2|csv|xml)$ {
        add_header Cache-Control "public";
        add_header X-Frame-Options "ALLOW-FROM *";
        expires +1y;
    }

}

According to documentation it says X-Frame-Options supports ALLOW-FROM uri but cannot see examples of using * (all domains) or adding certain multiple domains in this ALLOW-FROM. I need to allow all domains access to my static files folder.

Answer 1

Assuming you actually want CORS (Cross Origin Request Sharing) rather than just embedding in an iframe the configuration would be:

location /cdn-directory/ {

    location ~* \.(js|css|swf|eot|ttf|otf|woff|woff2)$ {
        add_header Cache-Control "public";
        add_header Access-Control-Allow-Origin: *
        expires +1y;
    }

}

Answer 2

Allowing all the domains to embed the resources (e.g., within iframe et al) is the default, and thus requires no extra headers.

The sole purpose of the X-Frame-Options HTTP Response Header is to prevent the interactive resources from being embedded in an iframe by an external site, thus if your intention is an ALLOW-FROM * (which is indeed not supposed to be a valid directive, as per above), then you should just omit this whole header altogether, and anyone would be able to have full and proper access to your static resources from any domain just as you please.

Answer 3

I didn't try it i nginx, but allowing the origin of current request works in tomcat:

add_header X-Frame-Options "ALLOW-FROM $http_origin";

Answer 4

location /cdn-directory/ {

location ~* \.(js|css|swf|eot|ttf|otf|woff|woff2)$ {
    add_header 'Cache-Control' 'public';
    add_header 'X-Frame-Options' 'ALLOW-FROM *';
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
    add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
    expires +1y;
  } 
}

http://enable-cors.org/server_nginx.html

Answer 5

It may be overkill, but I have used the following headers on a Magento 1.8.x install for CORS:

add_header 'Access-Control-Allow-Origin' "*";
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';