DEV Community

Farai Gandiya
Farai Gandiya

Posted on • Originally published at codelab.farai.xyz on

2 3

Adding Permissive CORS to Netlify

Adding Permissive CORS to Netlify was first published on Farai's Codelab.


CORS can be pretty annoying, but it’s important for security. Thing is, most sites don’t need strict CORS. Not saying that you should ignore CORS, just that you need to examine whether you need it and you typically don’t.

For me, I’m mostly okay with a permissive CORS so that people can run client-side scripts without a proxy, like a browser based RSS reader1. The only exception is fonts because I don’t want anyone hotlinking them and using my site as a CDN. I do plan on adding videos at some point.

Anyways, here’s part of my headers.toml file.

[[headers]]
    for = "/*"
    [headers.values]
        Access-Control-Allow-Origin = "*"
[[headers]]
    for = "/*.woff2"
    [headers.values]
        Access-Control-Allow-Origin = "codelab.farai.xyz"
Enter fullscreen mode Exit fullscreen mode

Previously, if you wanted to fetch something like the RSS feed, it would fail with an error like this:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://faraiscodelab.netlify.app/index.xml. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). [Learn More]

With the aforementioned CORS headers set, fetching everything but the fonts works fine. They could always pass the fetch through a proxy, but it’d probably easier to host the fonts themselves.


  1. This annoyed me with Youtube’s RSS feeds since they block fetches for them, even though it’s supposed to be shared! ↩︎


Thanks for reading! If you liked this post, consider supporting my work by:

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay