Supabase: CORS errors from browser [2026 fix]

Browser blocks requests to Supabase due to missing CORS headers. Add your domain to Project Settings > API > CORS allowed origins.

Supabase: CORS errors from browser [2026 fix]

TL;DR

---

Real Console Error Messages

You'll see one of these exact errors at 2am when production breaks:

``` Access to XMLHttpRequest at 'https://xxxxxxxxxxxx.supabase.co/rest/v1/users' from origin 'https://yourdomain.com' 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. ```

``` CORS policy: The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode (include). ```

``` Failed to load resource: the server responded with a status of 403 (net::ERR_FAILED) at https://xxxxxxxxxxxx.supabase.co/rest/v1/... ```

``` No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors'. ```

``` Access to fetch at 'https://xxxxxxxxxxxx.supabase.co/rest/v1/posts' from origin 'http://localhost:3000' has been blocked by CORS policy ```

---

Broken Code → Fixed Code

❌ BROKEN: Missing CORS configuration

```javascript // Your React/Vue/Next.js app making requests to Supabase import { createClient } from '@supabase/supabase-js'

const supabase = createClient( 'https://xxxxxxxxxxxx.supabase.co', 'YOUR_ANON_KEY' )

// This request fails in production because yourdomain.com isn't whitelisted async function fetchUsers() { const { data, error } = await supabase .from('users') .select('*') if (error) console.log('CORS blocked:', error) return data } ```

✅ FIXED: Add domain to CORS whitelist

Step 1: Update Supabase Project Settings

1. Go to [Supabase Dashboard](https://supabase.com) 2. Select your project 3. Navigate to Settings > API 4. Under CORS allowed origins, click Add origin 5. Enter your domain: - Production: https://yourdomain.com - Development: http://localhost:3000 (or your dev port) - Staging: https://staging.yourdomain.com

Step 2: Your code stays the same (no changes needed)

```javascript import { createClient } from '@supabase/supabase-js'

const supabase = createClient( 'https://xxxxxxxxxxxx.supabase.co', 'YOUR_ANON_KEY' )

// Now this works because yourdomain.com is in CORS whitelist async function fetchUsers() { const { data, error } = await supabase .from('users') .select('*') if (error) console.log('Error:', error) return data } ```

Step 3: Wait 30-60 seconds for the change to propagate to Supabase's edge network.

---

Why This Happens

When your browser makes a request to supabase.co from yourdomain.com, the browser automatically sends a CORS preflight request (OPTIONS method). Supabase checks if your origin is in the whitelist. If it's not there, the browser blocks the response—this is a security feature, not a bug.

This only affects browser requests (fetch/XMLHttpRequest). Server-to-server requests bypass CORS entirely.

---

Still broken? Check these too

1. Wildcard domains: If you added https://yourdomain.com but your app loads from https://www.yourdomain.com, they're treated as different origins. Add both, or use a wildcard pattern if your Supabase version supports it. Note: We're uncertain if wildcard patterns (https://*.yourdomain.com) work in all current versions—test in staging first.

2. Protocol mismatch: http://localhost:3000 and https://localhost:3000 are different origins. Ensure your CORS entry matches your exact dev URL.

3. Using an old anon key: If you regenerated your API keys in Supabase settings but didn't update your client, you'll get 403 errors. Redeploy with the latest key from Project Settings > API Keys.

See [authentication errors](/guide=supabase-auth) and [API key setup](/guide=supabase-keys) for related issues.

---

Found a different variation? Drop it in the comments

CORS issues have dozens of edge cases. If your error message is different or your fix didn't work with these steps, share the exact console error and your setup in the comments—the community will help troubleshoot.

---

Official Documentation

[Supabase CORS Configuration Docs](https://supabase.com/docs/guides/api/cors)