[SOLVED] Fonts files blocked by CORS policy

Issue

I am deploying my website on a Windows Server 2016 using Apache24 to serve static files. They all are ok (js, css, images) but the fonts files.

After reading through the internet I added this to httpd.conf file:

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

and uncomment line:

LoadModule headers_module modules/mod_headers.so

but I am still getting this error, where server_ip is a real server ip address

Access to Font at 'http://server_ip/static/control/fonts/glyphicons-halflings-regular.woff2' from origin 'http://server_ip:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://server_ip:8080' is therefore not allowed access.

Is this a problem related to the use of the ip address instead of the domain?? I am still waiting to the domain so I have to point to the ip.

Am I missing something in the apache configuration? Because I also added

<IfModule mime_module>
  AddType application/x-font-ttf .ttc .ttf
  AddType application/opentype .otf
  ...
</IfModule>
...
<IfModule rewrite_module>
  RewriteCond %{HTTPS} !=on
  RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
  RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
</IfModule>

with no results.

Any help will be appreciated. Thanks.

Solution

It was a problem related to the browser.

I realized that installing Chrome plugin Allow-Control-Allow-Origin: * was needed

Answered By - juankysmith

Answer Checked By - Clifford M. (WPSolving Volunteer)