Header set Access-Control-Allow-Origin "*"

[urljet]

Max cdn tried to add the following to htaccess for firefox compatibility. Only issues is that it hasn't worked


Is there a solution?

# ----------------------------------------------------------------------
# CORS-enabled images (@crossorigin)
# ----------------------------------------------------------------------
# Send CORS headers if browsers request them; enabled by default for images.
# developer.mozilla.org/en/CORS_Enabled_Image
# blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html
# hacks.mozilla.org/2011/11/using-cors-to-load-webgl-textures-from-cross-domain-images/
# wiki.mozilla.org/Security/Reviews/crossoriginAttribute
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
# mod_headers, y u no match by Content-Type?!
<FilesMatch "\.(gif|png|jpe?g|svg|svgz|ico|webp)$">
SetEnvIf Origin ":" IS_CORS
Header set Access-Control-Allow-Origin "*" env=IS_CORS
</FilesMatch>
</IfModule>
</IfModule>
# ----------------------------------------------------------------------
# Webfont access
# ----------------------------------------------------------------------
# Allow access from all domains for webfonts.
# Alternatively you could only whitelist your
# subdomains like "subdomain.example.com".
<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css|css)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>

 

[NiteWave]

so far

Header set Access-Control-Allow-Origin "*"

should be ok
but not support

SetEnvIf Origin ":" IS_CORS
Header set Access-Control-Allow-Origin "*" env=IS_CORS

the coming 5.x version may support it in a way but not clear yet.

 

[Alper Uzmezler]

I have been checking the development of this. Do you have any update for 5.0 roadmap for cors headers?

 

[NiteWave]

tested with latest lsws 5.0.10.
results: already support above directives. but found a possible bug during tests.

1.to understand what CORS means , here's best document I got to understand this time:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
so finally it looks pretty simple, there is a request header like:
Origin: http://foo.example

-- hope this can save time for those who have same question as me.

2. in .htaccess, add
<FilesMatch "\.(gif|png|jpe?g|svg|svgz|ico|webp)$">
SetEnvIf Origin ":" IS_CORS
Header set Access-Control-Allow-Origin "*" env=IS_CORS
</FilesMatch>

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

3. test .css
#curl -I 127.0.0.1:8080/a.css
HTTP/1.1 200 OK
Date: Tue, 05 Jan 2016 02:44:51 GMT
Server: Apache/2.2.3 (CentOS)
Last-Modified: Tue, 05 Jan 2016 02:24:17 GMT
ETag: "ad20667-0-5288cef303640"
Accept-Ranges: bytes
Access-Control-Allow-Origin: *
Connection: close
Content-Type: text/css

#curl -I 127.0.0.1:8180/a.css
HTTP/1.1 200 OK
ETag: "0-568b2951-941215177f8e1cff"
Last-Modified: Tue, 05 Jan 2016 02:24:17 GMT
Content-Type: text/css; charset=UTF-8
Content-Length: 0
Date: Tue, 05 Jan 2016 02:44:58 GMT
Accept-Ranges: bytes
Server: LiteSpeed
Access-Control-Allow-Origin: *

result: 100% success on both apache and litespeed

4. test .png
#curl -I -H "Origin:http://abc" 127.0.0.1:8180/a.png
HTTP/1.1 200 OK
ETag: "0-564d799b-e4087fa853624a0"
Last-Modified: Thu, 19 Nov 2015 07:26:19 GMT
Content-Type: image/png
Content-Length: 0
Date: Tue, 05 Jan 2016 02:49:07 GMT
Accept-Ranges: bytes
Server: LiteSpeed

#curl -I -H "Origin:http://abc" 127.0.0.1:8080/a.png
HTTP/1.1 200 OK
Date: Tue, 05 Jan 2016 02:49:13 GMT
Server: Apache/2.2.3 (CentOS)
Last-Modified: Thu, 19 Nov 2015 07:26:19 GMT
ETag: "ad20665-0-524dfaccd5cc0"
Accept-Ranges: bytes
Access-Control-Allow-Origin: *
Connection: close
Content-Type: image/png

result: success on apache, failure on litespeed.

5. change .htaccess, test again
#<FilesMatch "\.(gif|png|jpe?g|svg|svgz|ico|webp)$">
SetEnvIf Origin ":" IS_CORS
Header set Access-Control-Allow-Origin "*" env=IS_CORS
#</FilesMatch>

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

test again:
#curl -I -H "Origin:http://abc" 127.0.0.1:8180/a.png
HTTP/1.1 200 OK
ETag: "0-564d799b-e4087fa853624a0"
Last-Modified: Thu, 19 Nov 2015 07:26:19 GMT
Content-Type: image/png
Content-Length: 0
Date: Tue, 05 Jan 2016 02:52:43 GMT
Accept-Ranges: bytes
Server: LiteSpeed
Access-Control-Allow-Origin: *

#curl -I -H "Origin:http://abc" 127.0.0.1:8080/a.png
HTTP/1.1 200 OK
Date: Tue, 05 Jan 2016 02:52:55 GMT
Server: Apache/2.2.3 (CentOS)
Last-Modified: Thu, 19 Nov 2015 07:26:19 GMT
ETag: "ad20665-0-524dfaccd5cc0"
Accept-Ranges: bytes
Access-Control-Allow-Origin: *
Connection: close
Content-Type: image/png

result: success on both apache and litespeed

6. it looks at current lsws 5.0.10
SetEnvIf Origin ":" IS_CORS
not work within <FilesMatch >...</FilesMatch>
but works without <FilesMatch >...</FilesMatch>
while both are ok under apache.

conclusion: looks only 1 step now to 100% support original directives in .htaccess

 

[Alper Uzmezler]

Just give you an idea where I am going to use this.

https://github.com/Peer5/peer5-cors-config/blob/master/nginx.conf

There is Peer 2 Peer Cdn solution that leverages the webrtc.

In order to use the webrtc the files have to have the cors so that videos can be streamed.

I would sign up and test this and it will give you a good idea.