CORS Handbook
The complete guide to understanding and fixing CORS errors.
Built by headertest.com
CORS: The Complete Handbook for Modern Web APIs Cross-Origin Resource Sharing, or CORS, is one of the most misunderstood parts of web development. Teams lose hours to it because the browser error messages feel vague, framework defaults vary wildly, and many blog posts reduce the topic to “just add Access-Control-Allow-Origin: *”. That advice is often wrong. CORS is not an authentication system, not a CSRF defense, and not a server-to-server access control mechanism. It is a browser-enforced policy layer that decides whether frontend JavaScript running on one origin may read a response from another origin. ...
Chrome extensions live in a weird middle ground. They’re not normal web pages, but they’re not fully trusted native apps either. That matters a lot for CORS. If you build extensions long enough, you hit this fast: fetch() works in your background service worker the same request fails in a content script adding Access-Control-Allow-Origin to your request does nothing people tell you to “just use host_permissions” and then preflights still surprise you The mental model that has saved me the most time is this: ...
CORS in Azure API Management looks easy right up until the browser starts throwing useless errors and your API works fine in Postman. That’s the trap: CORS is a browser enforcement layer, and APIM adds another layer of policy behavior on top of it. If you put the policy in the wrong scope, return the wrong origin, or forget how preflight requests work, you get a mess that’s hard to debug. ...
If you try to call the BigCommerce REST Management API directly from browser JavaScript, you’re going to hit a wall. Not because your fetch() code is wrong, but because CORS is doing exactly what it’s supposed to do. BigCommerce has multiple API surfaces, and they do not behave the same way from a browser. That distinction matters: Storefront APIs are designed for browser-facing use cases Management APIs are meant for trusted server-side access CORS policy decides whether the browser will even allow your frontend code to read the response That’s the part people usually miss. The request may leave the browser just fine, but if the response doesn’t include the right CORS headers, your app still fails. ...
If you’ve ever tried calling a Magento REST API from a separate frontend and hit a browser error that looks vague, annoying, and borderline insulting, that was probably CORS. Magento itself usually isn’t the whole problem. The browser is enforcing the policy, your web server is often the layer that needs fixing, and authentication makes everything more fragile. Here’s the practical version: if your React, Vue, Next.js, or plain JavaScript app lives on https://storefront.example and your Magento API lives on https://shop.example, the browser treats that as cross-origin. Even if both domains are yours. ...
Firefox extensions sit in a weird spot for CORS. They look like frontend code, but they also get privileged access that normal web pages do not. That mismatch trips people up all the time. I’ve seen the same bug report more than once: “The API works in my extension background script, but fails in the popup.” “It works in Chrome, but Firefox blocks it.” “Why does fetch() behave differently depending on where I call it?” ...
CORS on Render usually fails for boring reasons: the wrong origin, missing preflight handling, or a preview URL you forgot to allow. If you deploy APIs or frontends on Render, you’ll hit this fast. Your frontend lives at one origin, your API at another, and the browser blocks requests unless the API sends the right Access-Control-* headers. Render itself doesn’t “do CORS” for your app. Your service has to return the headers. That’s the part many people miss. ...
CORS in Spring Boot looks easy right up until the browser starts throwing vague errors and your API “works in Postman” but fails in Chrome. That’s the normal path. Spring Boot gives you a few different places to configure CORS, and that flexibility is exactly why teams end up with broken preflight requests, duplicated headers, or insecure wildcard rules in production. I’ve seen all three. This guide covers how CORS actually works in a Spring Boot app, when to use each configuration style, and the mistakes that tend to waste the most time. ...
I’ve seen a lot of Go APIs ship with one of two CORS setups: AllowOrigins: ["*"] and a prayer no CORS config at all, followed by frontend people yelling in Slack Both work fine right up until browsers get involved. This case study is based on a pretty typical setup: a Go backend serving JSON to a separate frontend app, first on localhost, then across staging and production domains. The backend started on Gin, another service used Echo, and both had the same problem: “it works in curl” but fails in the browser. ...
CORS for WPGraphQL usually gets treated like a checkbox: “just add Access-Control-Allow-Origin and move on.” That’s how you end up with broken auth, failed preflights, or a GraphQL endpoint that quietly accepts requests from places it shouldn’t. If you’re exposing /graphql from WordPress, CORS deserves a deliberate setup. WPGraphQL makes WordPress feel like an app backend, which means browsers start enforcing cross-origin rules in ways a normal PHP theme never had to care about. ...