CORS (Cross-Origin Resource Sharing) support for Invoking from the browser
To invoke edge functions from the browser, you need to handle CORS Preflight requests.
See the example on GitHub.
We recommend adding a cors.ts
file within a _shared
folder which makes it easy to reuse the CORS headers across functions:
_10export const corsHeaders = {
_10 'Access-Control-Allow-Origin': '*',
_10 'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
You can then import and use the CORS headers within your functions:
_27import { corsHeaders } from '../_shared/cors.ts'
_27console.log(`Function "browser-with-cors" up and running!`)
_27Deno.serve(async (req) => {
_27 // This is needed if you're planning to invoke your function from a browser.
_27 if (req.method === 'OPTIONS') {
_27 return new Response('ok', { headers: corsHeaders })
_27 const { name } = await req.json()
_27 message: `Hello ${name}!`,
_27 return new Response(JSON.stringify(data), {
_27 headers: { ...corsHeaders, 'Content-Type': 'application/json' },
_27 return new Response(JSON.stringify({ error: error.message }), {
_27 headers: { ...corsHeaders, 'Content-Type': 'application/json' },