CODEWITHSUNDEEP
ubuntufirefoxgoogle-font-api
Brandon
Brandon

Reputation: 1855

Why is google fonts not loading on firefox on ubuntu 18.04?

I'm getting this message:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://fonts.googleapis.com/css?family=Montserrat:400,500,6…700%7COpen+Sans:300,300i,400,400i,600,600i,700,700i%7CImpact. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

This is the javascript that is loading on the page:

<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script>
  WebFont.load({
    active: function() {
      $(document).trigger('fonts-loaded')
    },
    google: {
      families: ['Montserrat:400,500,600,700', 'Open Sans:300,300i,400,400i,600,600i,700,700i', 'Impact']
    }
  });
</script>

I understand the basics of the issue, but I don't understand what I can do to fix it as a client, since all of the solutions I can find are server-side.

Here is the URL https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700%7COpen+Sans:300,300i,400,400i,600,600i,700,700i%7CImpact

Upvotes: 1

Views: 1530

Answers (1)

Massimo
Massimo

Reputation: 3460

1) To troubleshoot this issue, use a browser with developer tools, like Chrome and Firefox:

  • open the browser and the webpage using google fonts
  • hit F12 : you should see the window of the developer tools
  • reload the web page
  • tools: switch to the network tab
  • now you can see exactly the response of the server, with the HTTP headers

This way you can see the CORS settings.

2) It could be they just block "localhost"

Can you try to put the page online (on a internet faced host) ?

3) Load the fonts from another location

There are free CDN caching the most used libraries. I suggest you to try to load the Google fonts from Cloudflare

Upvotes: 1

Related Questions