lywsvip/supabase
1
0
Fork 0
mirror of https://github.com/supabase/supabase.git synced 2026-05-06 22:18:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Revert "docs: update cors documentation to include new method" (#42524)

Browse Source 
Reverts supabase/supabase#42506

`esm.sh` does not work, so we will revert this version for now.
This commit is contained in:
Katerina Skroumpelou
2026-02-05 22:03:33 +02:00
committed by GitHub
parent 7494258b45
commit c730dc37fd
9 changed files with 34 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
apps/docs/content/guides/functions/cors.mdx
View File

@@ -10,16 +10,19 @@ See the [example on GitHub](https://github.com/supabase/supabase/blob/master/exa
### Recommended setup
<Admonition type="tip">
We recommend adding a `cors.ts` file within a [`_shared` folder](/docs/guides/functions/quickstart#organizing-your-edge-functions) which makes it easy to reuse the CORS headers across functions:
**For `@supabase/supabase-js` v2.95.0 and later:** Import CORS headers directly from the SDK to ensure they stay synchronized with any new headers added to the client libraries.
```ts cors.ts
export const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
}
```
</Admonition>
Import `corsHeaders` from `@supabase/supabase-js/cors` to automatically get all required headers:
You can then import and use the CORS headers within your functions:
```ts index.ts
import { corsHeaders } from '@supabase/supabase-js/cors'
import { corsHeaders } from '../_shared/cors.ts'
console.log(`Function "browser-with-cors" up and running!`)
@@ -47,24 +50,3 @@ Deno.serve(async (req) => {
}
})
```
This approach ensures that when new headers are added to the Supabase SDK, your Edge Functions automatically include them, preventing CORS errors.
#### For versions before 2.95.0
If you're using `@supabase/supabase-js` before v2.95.0, you'll need to hardcode the CORS headers. Add a `cors.ts` file within a [`_shared` folder](/docs/guides/functions/quickstart#organizing-your-edge-functions):
```ts _shared/cors.ts
export const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
}
```
Then import it in your function:
```ts index.ts
import { corsHeaders } from '../_shared/cors.ts'
// ... rest of your function code
```

2
apps/docs/content/guides/functions/examples/cloudflare-turnstile.mdx
View File

@@ -23,7 +23,7 @@ supabase functions new cloudflare-turnstile
And add the code to the `index.ts` file:
```ts index.ts
import { corsHeaders } from '@supabase/supabase-js/cors' // v2.95.0+
import { corsHeaders } from '../_shared/cors.ts'
console.log('Hello from Cloudflare Trunstile!')

21
apps/docs/content/guides/functions/troubleshooting.mdx
View File

@@ -112,26 +112,25 @@ For invocation or CORS issues:
```tsx
// ✅ Proper CORS handling
import { corsHeaders } from '@supabase/supabase-js/cors' // v2.95.0+
Deno.serve(async (req) => {
if (req.method === 'OPTIONS') {
return new Response('ok', { headers: corsHeaders })
return new Response(null, {
status: 200,
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'POST, GET, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
})
}
// Your function logic here
return new Response(JSON.stringify({ status: 'Success' }), {
headers: { ...corsHeaders, 'Content-Type': 'application/json' },
return new Response('Success', {
headers: { 'Access-Control-Allow-Origin': '*' },
})
})
```
<Admonition type="note">
For `@supabase/supabase-js` versions before v2.95.0, you'll need to hardcode the CORS headers. See the [CORS guide](/docs/guides/functions/cors) for details.
</Admonition>
There are two debugging tools available: Invocations and Logs. Invocations shows the Request and Response for each execution, while Logs shows any platform events, including deployments and errors.
---

8
examples/edge-functions/supabase/functions/_shared/cors.ts
View File

@@ -1,11 +1,3 @@
// NOTE: For @supabase/supabase-js v2.95.0 and later, you can import CORS headers
// directly from the SDK instead of hardcoding them:
//
// import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
//
// This ensures your CORS headers stay synchronized with any new headers added to the SDK.
// For versions before 2.95.0, use this hardcoded configuration:
export const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',

6
examples/edge-functions/supabase/functions/browser-with-cors/index.ts
View File

@@ -2,11 +2,7 @@
// https://deno.land/manual/getting_started/setup_your_environment
// This enables autocomplete, go to definition, etc.
// For @supabase/supabase-js v2.95.0+, import CORS headers directly from the SDK:
import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
// For older versions, use a shared cors.ts file:
// import { corsHeaders } from '../_shared/cors.ts'
import { corsHeaders } from '../_shared/cors.ts'
console.log(`Function "browser-with-cors" up and running!`)

5
examples/edge-functions/supabase/functions/get-tshirt-competition/index.ts
View File

@@ -3,10 +3,7 @@
// This enables autocomplete, go to definition, etc.
import { createClient } from 'npm:supabase-js@2'
// New approach (v2.95.0+)
import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
// For older versions:
// import { corsHeaders } from '../_shared/cors.ts'
import { corsHeaders } from '../_shared/cors.ts'
console.log(`Function "get-tshirt-competition" up and running!`)

12
examples/edge-functions/supabase/functions/read-storage/index.ts
View File

@@ -3,13 +3,11 @@
// This enables autocomplete, go to definition, etc.
import { createClient } from 'npm:supabase-js@2'
// New approach (v2.95.0+)
import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
// For older versions, use hardcoded headers:
// const corsHeaders = {
// 'Access-Control-Allow-Origin': '*',
// 'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
// }
const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey',
}
Deno.serve(async (req) => {
// read a text file from storage and print its contents

14
examples/edge-functions/supabase/functions/restful-tasks/index.ts
View File

@@ -3,14 +3,12 @@
// This enables autocomplete, go to definition, etc.
import { createClient, SupabaseClient } from 'npm:supabase-js@2'
// New approach (v2.95.0+)
import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
// For older versions, use hardcoded headers:
// const corsHeaders = {
// 'Access-Control-Allow-Origin': '*',
// 'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
// 'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, PUT, DELETE',
// }
const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey',
'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, PUT, DELETE',
}
interface Task {
name: string

5
examples/edge-functions/supabase/functions/select-from-table-with-auth-rls/index.ts
View File

@@ -3,10 +3,7 @@
// This enables autocomplete, go to definition, etc.
import { createClient } from 'npm:supabase-js@2'
// New approach (v2.95.0+)
import { corsHeaders } from 'jsr:@supabase/supabase-js@2/cors'
// For older versions:
// import { corsHeaders } from '../_shared/cors.ts'
import { corsHeaders } from '../_shared/cors.ts'
console.log(`Function "select-from-table-with-auth-rls" up and running!`)