中文
devexamples

Supabase Client Filtered Data Query

Query a Supabase table with typed client filters, range pagination, upsert conflicts, and realtime subscription cleanup in one flow.

JavascriptData Fetching

Code

snippet
import { createClient } from '@supabase/supabase-js';

const supabase = createClient(
  process.env.SUPABASE_URL,
  process.env.SUPABASE_ANON_KEY,
  { persistSession: false },
);

const { data: active, error } = await supabase
  .from('projects')
  .select('id, name, owner_id, updated_at')
  .eq('status', 'active')
  .gte('updated_at', '2026-10-01')
  .order('updated_at', { ascending: false })
  .range(0, 19);

if (error) throw new Error(error.message);

const { data: upserted } = await supabase
  .from('projects')
  .upsert({ id: 77, name: 'pipeline', status: 'active' }, { onConflict: 'id' })
  .select();

const channel = supabase
  .channel('projects-changes')
  .on('postgres_changes', { event: '*', schema: 'public', table: 'projects' },
    (payload) => console.log('change:', payload.event))
  .subscribe();

await new Promise((r) => setTimeout(r, 1000));
supabase.removeChannel(channel);
console.log('active projects:', active.length, 'upserted:', upserted.length);

Related Examples