Course lesson

Query Supabase from Cloudflare Worker

Supabase JS is an NPM package which provides a simple interface from JavaScript to our Supabase project. It allows us to query and mutate data using its Object Relational Mapping (ORM) syntax, and subscribe to realtime events.

Duration: 3 min
Access: Free
Transcript: Retained from source evidence

In this video, we install the Supabase JS package and create a new client using our project's URL and Anon Key. These can be found in the Supabase dashboard for our project, under Settings > API.

We store these values as secrets in our Cloudflare account, and use them to instantiate a new Supabase client.

Additionally, we write a query to select all of our articles from our Supabase instance, and send them back as the response from our Cloudflare Worker.

In order to send a JSON response, we first stringify the object we get back from Supabase, and then set a Content-Type header to notify the browser that this will be a type of application/json.

Code Snippets

Install Supabase JS

Terminal

npm i @supabase/supabase-js

Create a Cloudflare secret

Terminal

npx wrangler secret put NAME

Add a secret for SUPABASE_URL

Terminal

npx wrangler secret put SUPABASE_URL

Run wrangler development server

Terminal

npx wrangler dev

Add a secret for SUPABASE_ANON_KEY

Terminal

npx wrangler secret put SUPABASE_ANON_KEY

Query data from Supabase

const { data } = await supabase.from("articles").select("*");

Send JSON response

return new Response(JSON.stringify(data), {
  headers: {
    "Content-Type": "application/json",
  },
});

Code Snippets

Resources