asked on

How can I fix my CORS errors?

Hi all,

I am getting errors in the console similar to the below at https://www.fobgfc.org/

Access to XMLHttpRequest at 'https://kit.fontawesome.com/6b3cd631e3.js' from origin 'https://www.fobgfc.org' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

content_script.js:207 GET https://kit.fontawesome.com/6b3cd631e3.js net::ERR_FAILED

I am using Chrome.

In addition to font-awesome, the same errors are appearing with google analytics etc, but I have selected the font-awesome one for this question because it is the simplest to debug for me.

As far as I can work out, the font-awesome fonts are appearing as they should when they are required, so is this just a warning?

I have searched EE and found other CORS-related questions and answers but cannot apply them to my instance.

Any help much appreciated.

Colin

David Favor

Try first adding this to your Webserver config as a header to push for all requests.

Access-Control-Allow-Origin: *

Open in new window

Once you have this working, then you can tighten your policy, as required.

Colin Brazier

ASKER

Sorry David....Webserver config? Do you mean add an htaccess file?

David Favor

Apache docs say, "Because early directives are processed before the request path's configuration is traversed, early headers can only be set in a main server or virtual host context. Early directives cannot depend on a request path, so they will fail in contexts such as <Directory> or <Location>."

Which likely means the answer to your question is no.

The... best practices... place to add these is in your /etc/apache2/{conf-available,conf-enabled}/headers.conf file (or your Distro's equivalent).

These *.conf files run in the Apache global context, so apply to all hosts.

ASKER CERTIFIED SOLUTION

Chris Stanyon

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Colin Brazier

ASKER

Thanks Chris, no errors are reported in Edge or Firefox and the fonts are being displayed as required in these as well as Chrome, so I'll ignore the warnings.

Col

David Favor

@Chris is correct.

You can only access content which you're allowed to access.

This is the reason for CORS.

If you don't own the site where content lives, you can't access it... well... in a browser...

Since CORS is only browser enforced, it's fairly useless.

If you'd like to access CORS blocked data, just use curl or wget or one of the many headless browsers (with JavaScript support), then just disable CORS on your side, to access the data.

And... you still won't be able to do this in 1x step in a browser.

You'll do this in 2x steps - Download data outside browser, then make data available through a Website you control for browsers.

CORS is like... It's an "advisory" policy... rather than "enforced/real" policy.