[Resolved] Access-Control-Allow-Origin problem for subsites

[xeredin]

hi

im using wordpress-mu and I’m having a problem icons on subsite not working The following errors are in the console;

“(index):1 Access to font at ‘https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.woff2’ from origin ‘https://subname.mydomain.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
(index):1517 GET https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.woff2 net::ERR_FAILED
(index):1 Access to font at ‘https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.woff’ from origin ‘https://subname.mydomain.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
(index):1 GET https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.woff net::ERR_FAILED
(index):1 Access to font at ‘https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.ttf’ from origin ‘https://subname.mydomain.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
(index):1 GET https://mydomain.com/tistdank/themes/generatepress/fonts/generatepress.ttf net::ERR_FAILED”

i did the necessary corrections via htaccess but the problem is not solved.

<FilesMatch “.(ttf|otf|woff|woff2|css)$”>
Header set Access-Control-Allow-Origin “*”
</FilesMatch>

please help.

[Tom]

Hi there,

Seems you set this to Resolved. Did you get it fixed?

Let me know 🙂

[xeredin]

hello
yes

<ifmodule mod_headers.c=””>
SetEnvIf Origin “^(.*\.domain\.com)$” ORIGIN_SUB_DOMAIN=$1
Header set Access-Control-Allow-Origin “%{ORIGIN_SUB_DOMAIN}e” env=ORIGIN_SUB_DOMAIN
Header set Access-Control-Allow-Methods: “*”
Header set Access-Control-Allow-Headers: “Origin, X-Requested-With, Content-Type, Accept, Authorization”
</ifmodule>

[Tom]

Awesome 🙂

[xeredin]

hi yes I hope this method helps other people

[Tom]

Thanks for sharing it 🙂

[Sibi Paul]

I have almost same problem.

Added that code into my htaccess, but it not solved.

My Default htaccess looks like this.

# BEGIN LSCACHE
## LITESPEED WP CACHE PLUGIN - Do not edit the contents of this block! ##
<IfModule LiteSpeed>
RewriteEngine on
CacheLookup on
RewriteRule .* - [E=Cache-Control:no-autoflush]
RewriteRule ^min/\w+\.(css|js) - [E=cache-control:no-vary]

### marker CACHE RESOURCE start ###
RewriteRule wp-content/.*/[^/]*(responsive|css|js|dynamic|loader|fonts)\.php - [E=cache-control:max-age=3600]
### marker CACHE RESOURCE end ###

### marker FAVICON start ###
RewriteRule favicon\.ico$ - [E=cache-control:max-age=86400]
### marker FAVICON end ###

### marker CORS start ###
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font\.css)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
### marker CORS end ###

</IfModule>
## LITESPEED WP CACHE PLUGIN - Do not edit the contents of this block! ##
# END LSCACHE
# BEGIN NON_LSCACHE
## LITESPEED WP CACHE PLUGIN - Do not edit the contents of this block! ##
### marker MINIFY start ###
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} ^(.*)/min/(\w+)\.(css|js)$
RewriteCond %1/wp-content/cache/$2/$1.$2 -f
RewriteRule min/(\w+)\.(css|js) wp-content/cache/$2/$1.$2 [L]
</IfModule>
### marker MINIFY end ###

## LITESPEED WP CACHE PLUGIN - Do not edit the contents of this block! ##
# END NON_LSCACHE

# BEGIN WordPress
# The directives (lines) between <code>BEGIN WordPress</code> and <code>END WordPress</code> are
# dynamically generated, and should only be modified via WordPress filters.
# Any changes to the directives between these markers will be overwritten.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Server: Digital Ocean + Litespeed Ent + Cyber Panel Ent
CDN: AWS Cloudfront

When, I disable CDN, No Such Error in Console.

Actual Error is this.

Access to font at 'https://cdn.mysite.com/wp-content/themes/generatepress/fonts/generatepress.woff2' from origin 'https://www.mysite.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Failed to load resource: net::ERR_FAILED https://cdn.mysite.com/wp-content/themes/generatepress/fonts/generatepress.woff2

These Errors Disappear When I Disable CDN.

[Leo]

Can you try using the SVG option?
https://docs.generatepress.com/article/svg-icons/

Let me know 🙂

[Author]

Posts