Wie man die Supabase API verwendet: Eine vollständige Anleitung

Dieser Leitfaden bietet einen umfassenden Überblick zur Nutzung der Supabase API.

Leo Schulz

Leo Schulz

5 June 2025

Wie man die Supabase API verwendet: Eine vollständige Anleitung

Supabase hat sich rasch zu einer leistungsstarken Open-Source-Alternative zu Firebase entwickelt und bietet Entwicklern eine Reihe von Tools, die auf einer PostgreSQL-Datenbank basieren. Im Kern bietet Supabase eine sofortige, Echtzeit-API-Schicht über Ihrer Datenbank, wodurch die Backend-Entwicklung erheblich beschleunigt wird. Dieser Leitfaden bietet einen umfassenden Überblick darüber, wie Sie die Supabase-API nutzen können, und behandelt alles von der Ersteinrichtung und den grundlegenden Operationen bis hin zu Sicherheit, Anpassung und Typsicherheit.

💡
Want a great API Testing tool that generates beautiful API Documentation?

Want an integrated, All-in-One platform for your Developer Team to work together with maximum productivity?

Apidog delivers all your demans, and replaces Postman at a much more affordable price!
button

1. Einführung: Was ist die Supabase-API?

Im Gegensatz zur traditionellen Backend-Entwicklung, bei der Sie möglicherweise viel Zeit mit dem Erstellen von REST- oder GraphQL-Endpunkten für die Interaktion mit Ihrer Datenbank verbringen, generiert Supabase automatisch eine sichere und performante API für Sie. Wenn Sie in Ihrer Supabase PostgreSQL-Datenbank eine Tabelle erstellen, verwendet Supabase PostgREST, ein Open-Source-Tool, um Ihr Datenbankschema zu untersuchen und entsprechende RESTful-Endpunkte bereitzustellen.

Wesentliche Vorteile:

Dieser Leitfaden konzentriert sich in erster Linie auf die REST-API und ihre Interaktion über Client-Bibliotheken sowie auf Supabase Edge Functions.

2. Erste Schritte mit der Supabase-API

Der einfachste Weg, die Supabase-API zu verstehen, ist, gleich einzusteigen. Nehmen wir an, Sie haben ein Supabase-Projekt eingerichtet (andernfalls besuchen Sie supabase.com und erstellen Sie kostenlos eines) und eine einfache Tabelle erstellt, z. B. profiles:

-- Create a table for public profiles
create table profiles (
  id uuid references auth.users not null primary key,
  updated_at timestamp with time zone,
  username text unique,
  avatar_url text,
  website text,

  constraint username_length check (char_length(username) >= 3)
);

-- Set up Row Level Security (RLS)
-- See https://supabase.com/docs/guides/auth/row-level-security for more details.
alter table profiles
  enable row level security;

create policy "Public profiles are viewable by everyone." on profiles
  for select using (true);

create policy "Users can insert their own profile." on profiles
  for insert with check (auth.uid() = id);

create policy "Users can update own profile." on profiles
  for update using (auth.uid() = id);

-- This trigger automatically creates a profile entry when a new user signs up via Supabase Auth.
-- See https://supabase.com/docs/guides/auth/managing-user-data#using-triggers for more details.
create function public.handle_new_user()
returns trigger as $$
begin
  insert into public.profiles (id, username)
  values (new.id, new.raw_user_meta_data->>'username');
  return new;
end;
$$ language plpgsql security definer;
create trigger on_auth_user_created
  after insert on auth.users
  for each row execute procedure public.handle_new_user();

(Hinweis: Das obige Beispiel verwendet profiles, was mit den Standardbeispielen von Supabase übereinstimmt. Das Konzept gilt gleichermaßen für eine todos-Tabelle oder eine andere Tabelle, die Sie erstellen.)

So finden Sie Ihre API-Anmeldeinformationen:

Jedes Supabase-Projekt verfügt über eindeutige API-Anmeldeinformationen:

  1. Projekt-URL: Ihr eindeutiger Supabase-Endpunkt (z. B. https://<your-project-ref>.supabase.co).
  2. API-Schlüssel: Zu finden in Ihrem Supabase-Projekt-Dashboard unter Project Settings > API.

Interaktion mit der API (unter Verwendung der Supabase JS Client Library):

Supabase bietet Client-Bibliotheken, um API-Interaktionen zu vereinfachen. So würden Sie die JavaScript-Bibliothek (supabase-js) verwenden:

// 1. Import and initialize the client
import { createClient } from '@supabase/supabase-js'

const supabaseUrl = 'https://<your-project-ref>.supabase.co'
const supabaseAnonKey = '<your-anon-key>'

const supabase = createClient(supabaseUrl, supabaseAnonKey)

// 2. Fetch data (SELECT *)
async function getProfiles() {
  const { data, error } = await supabase
    .from('profiles')
    .select('*')

  if (error) console.error('Error fetching profiles:', error)
  else console.log('Profiles:', data)
}

// 3. Insert data (INSERT)
async function createProfile(userId, username) {
  const { data, error } = await supabase
    .from('profiles')
    .insert([
      { id: userId, username: username, updated_at: new Date() },
    ])
    .select() // Return the inserted data

  if (error) console.error('Error creating profile:', error)
  else console.log('Created Profile:', data)
}

// 4. Update data (UPDATE)
async function updateProfileUsername(userId, newUsername) {
  const { data, error } = await supabase
    .from('profiles')
    .update({ username: newUsername, updated_at: new Date() })
    .eq('id', userId) // Only update where id matches
    .select()

  if (error) console.error('Error updating profile:', error)
  else console.log('Updated Profile:', data)
}

// 5. Delete data (DELETE)
async function deleteProfile(userId) {
  const { data, error } = await supabase
    .from('profiles')
    .delete()
    .eq('id', userId) // Only delete where id matches

  if (error) console.error('Error deleting profile:', error)
  // Note: Delete often returns minimal data on success unless .select() is used *before* .delete() on some versions/setups.
  else console.log('Profile deleted successfully')
}

// Example Usage (assuming you have a user ID)
// getProfiles();
// createProfile('some-uuid-v4', 'new_user');
// updateProfileUsername('some-uuid-v4', 'updated_username');
// deleteProfile('some-uuid-v4');

Dieser Schnellstart demonstriert die grundlegenden CRUD-Operationen (Create, Read, Update, Delete) mithilfe der Client-Bibliothek, die intern die REST-API aufruft.

3. Die automatisch generierte Supabase REST-API

Während Client-Bibliotheken praktisch sind, ist das Verständnis der zugrunde liegenden REST-API, die von PostgREST generiert wird, von entscheidender Bedeutung.

API-Endpunktstruktur:

Die Basis-URL für die REST-API lautet typischerweise: https://<your-project-ref>.supabase.co/rest/v1/

Endpunkte werden automatisch für Ihre Tabellen erstellt:

Authentifizierung:

API-Anforderungen müssen Ihren API-Schlüssel im apikey-Header und in der Regel einen Authorization-Header mit Bearer <your-api-key> enthalten (oft der gleiche anon-Schlüssel für clientseitige Anforderungen oder der service_role-Schlüssel für serverseitige Anforderungen).

apikey: <your-anon-or-service-role-key>
Authorization: Bearer <your-anon-or-service-role-key>

Häufige Operationen (mit curl-Beispielen):

Lassen Sie uns die vorherigen Beispiele mithilfe von curl direkt gegen die REST-API replizieren. Ersetzen Sie Platzhalter entsprechend.

Daten abrufen (GET):

curl 'https://<ref>.supabase.co/rest/v1/profiles?select=*' \
  -H "apikey: <anon-key>" \
  -H "Authorization: Bearer <anon-key>"

Daten einfügen (POST):

curl 'https://<ref>.supabase.co/rest/v1/profiles' \
  -X POST \
  -H "apikey: <anon-key>" \
  -H "Authorization: Bearer <anon-key>" \
  -H "Content-Type: application/json" \
  -H "Prefer: return=representation" \# Optional: Returns the inserted row(s) \
  -d '{ "id": "some-uuid", "username": "rest_user" }'

Daten aktualisieren (PATCH): (Profil aktualisieren, wobei der Benutzername 'rest_user' ist)

curl 'https://<ref>.supabase.co/rest/v1/profiles?username=eq.rest_user' \
  -X PATCH \
  -H "apikey: <anon-key>" \
  -H "Authorization: Bearer <anon-key>" \
  -H "Content-Type: application/json" \
  -H "Prefer: return=representation" \
  -d '{ "website": "https://example.com" }'

Daten löschen (DELETE): (Profil löschen, wobei der Benutzername 'rest_user' ist)

curl 'https://<ref>.supabase.co/rest/v1/profiles?username=eq.rest_user' \
  -X DELETE \
  -H "apikey: <anon-key>" \
  -H "Authorization: Bearer <anon-key>"

Filtern, Auswählen, Sortieren, Paginierung:

Die REST-API unterstützt leistungsstarke Abfragen über URL-Parameter:

Automatisch generierte API-Dokumentation:

Eines der hilfreichsten Features von Supabase ist die automatisch generierte API-Dokumentation, die direkt in Ihrem Projekt-Dashboard verfügbar ist.

  1. Navigieren Sie zu Ihrem Supabase-Projekt.
  2. Klicken Sie in der linken Seitenleiste auf das API-Docs-Symbol (sieht normalerweise wie <> aus).
  3. Wählen Sie unter "Tabellen und Ansichten" eine Tabelle aus.
  4. Sie sehen detaillierte Dokumentation für die REST-Endpunkte, die für diese Tabelle spezifisch sind, einschließlich:

Diese interaktive Dokumentation ist von unschätzbarem Wert, um zu verstehen, wie Sie Ihre API-Aufrufe strukturieren können.

4. Generieren von Typen für eine erweiterte Entwicklung mit der Supabase-API

Für Projekte, die TypeScript oder andere typisierte Sprachen verwenden, bietet Supabase eine Möglichkeit, Typdefinitionen direkt aus Ihrem Datenbankschema zu generieren. Dies bringt erhebliche Vorteile mit sich:

Generieren von Typen mit der Supabase CLI:

  1. Supabase CLI installieren: Befolgen Sie die Anweisungen unter https://supabase.com/docs/guides/cli.
  2. Anmelden: supabase login
  3. Verknüpfen Sie Ihr Projekt: supabase link --project-ref <your-project-ref> (Führen Sie dies in Ihrem lokalen Projektverzeichnis aus). Möglicherweise müssen Sie ein Datenbankkennwort angeben.
  4. Typen generieren:
supabase gen types typescript --linked > src/database.types.ts
# Or specify project-id if not linked or in a different context
# supabase gen types typescript --project-id <your-project-ref> > src/database.types.ts

Dieser Befehl untersucht das Datenbankschema Ihres verknüpften Supabase-Projekts und gibt eine TypeScript-Datei (in diesem Beispiel database.types.ts) aus, die Schnittstellen für Ihre Tabellen, Ansichten und Funktionsargumente/-Rückgabetypen enthält.

Verwenden von generierten Typen:

Sie können diese Typen dann in Ihren Anwendungscode importieren:

import { createClient } from '@supabase/supabase-js'
// Import the generated types
import { Database } from './database.types' // Adjust path as needed

const supabaseUrl = 'https://<your-project-ref>.supabase.co'
const supabaseAnonKey = '<your-anon-key>'

// Provide the Database type to createClient
const supabase = createClient<Database>(supabaseUrl, supabaseAnonKey)

// Now you get type safety and autocompletion!
async function getSpecificUserProfile(username: string) {
  // Autocompletes table names ('profiles')
  const { data, error } = await supabase
    .from('profiles')
    // Autocompletes column names ('id', 'username', 'website')
    .select('id, username, website')
    // Type checks the value against the column type
    .eq('username', username)
    .single() // Expects a single result or null

  if (error) {
    console.error('Error fetching profile:', error)
    return null;
  }

  // 'data' is now correctly typed based on your select query
  if (data) {
    console.log(`User ID: ${data.id}, Website: ${data.website}`);
    // console.log(data.non_existent_column); // <-- TypeScript error!
  }

  return data;
}

Das Generieren von Typen ist eine sehr empfehlenswerte Vorgehensweise für eine robuste Anwendungsentwicklung mit Supabase.

5. Erstellen benutzerdefinierter Supabase-API-Routen mit Edge Functions

Während die automatisch generierte REST-API Standard-CRUD-Operationen abdeckt, benötigen Sie häufig benutzerdefinierte serverseitige Logik für:

Supabase Edge Functions bieten eine Möglichkeit, Deno-basierte TypeScript-Funktionen global am Edge, in der Nähe Ihrer Benutzer, bereitzustellen.

Erstellen einer Edge Function:

  1. Funktionen initialisieren (falls noch nicht geschehen): supabase functions new hello-world (ausführen in Ihrem verknüpften Projektverzeichnis). Dadurch wird eine Datei supabase/functions/hello-world/index.ts erstellt.

Schreiben Sie Ihren Funktionscode:

// supabase/functions/hello-world/index.ts
import { serve } from 'https://deno.land/std@0.177.0/http/server.ts' // Use appropriate std version

serve(async (req) => {
  // You can access request headers, method, body etc. from 'req'
  console.log(`Request received for: ${req.url}`);

  // Example: Accessing Supabase DB from within the function
  // Note: Requires setting up the Supabase client *inside* the function
  // Use environment variables for secrets!
  // import { createClient } from '@supabase/supabase-js'
  // const supabaseAdmin = createClient(
  //   Deno.env.get('SUPABASE_URL') ?? '',
  //   Deno.env.get('SUPABASE_SERVICE_ROLE_KEY') ?? ''
  // )
  // const { data: users, error } = await supabaseAdmin.from('profiles').select('*').limit(10);

  const data = {
    message: `Hello from the Edge!`,
    // users: users // Example if fetching data
  }

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

Stellen Sie die Funktion bereit:

supabase functions deploy hello-world --no-verify-jwt
# Use --no-verify-jwt for publicly accessible functions
# Omit it or set --verify-jwt=true to require a valid Supabase Auth JWT

Rufen Sie die Funktion auf:
Sie können bereitgestellte Funktionen über HTTP POST-Anforderungen (oder GET, abhängig von der Funktionslogik) an ihren eindeutigen Endpunkt aufrufen:
https://<your-project-ref>.supabase.co/functions/v1/hello-world

Mit curl:

curl -X POST 'https://<ref>.supabase.co/functions/v1/hello-world' \
  -H "Authorization: Bearer <user-jwt-if-required>" \
  -H "Content-Type: application/json" \
  -d '{"name": "Functions"}' # Optional request body

Oder mit dem Supabase JS-Client:

const { data, error } = await supabase.functions.invoke('hello-world', {
  method: 'POST', // or 'GET', etc.
  body: { name: 'Functions' }
})

Edge Functions sind ein leistungsstarkes Werkzeug, um Ihre Supabase-Backend-Funktionen über einfache Datenbankoperationen hinaus zu erweitern.

6. API-Schlüssel und Sichern Ihrer Supabase-API

Das Verständnis von API-Schlüsseln und die Implementierung geeigneter Sicherheitsmaßnahmen ist nicht verhandelbar.

API-Schlüssel-Rückblick:

Die entscheidende Rolle von Row Level Security (RLS):

RLS ist der Eckpfeiler der Supabase-Sicherheit bei Verwendung des anon-Schlüssels. Es ermöglicht Ihnen, detaillierte Zugriffskontrollrichtlinien direkt in der PostgreSQL-Datenbank zu definieren. Richtlinien sind im Wesentlichen SQL-Regeln, die bestimmen, welche Zeilen ein Benutzer basierend auf seinem Authentifizierungsstatus, seiner Benutzer-ID, seiner Rolle oder anderen Kriterien anzeigen, einfügen, aktualisieren oder löschen kann.

Aktivieren von RLS:

Standardmäßig ist RLS für neue Tabellen deaktiviert. Sie müssen es für jede Tabelle aktivieren, auf die Sie clientseitig mit dem anon-Schlüssel zugreifen möchten.

-- Enable RLS on the 'profiles' table
ALTER TABLE profiles ENABLE ROW LEVEL SECURITY;

-- IMPORTANT: If no policies are defined after enabling RLS,
-- access is implicitly denied for all operations (except the table owner).

Erstellen von RLS-Richtlinien:

Richtlinien definieren die USING-Klausel (für Lesezugriff wie SELECT, UPDATE, DELETE) und die WITH CHECK-Klausel (für Schreibzugriff wie INSERT, UPDATE).

Beispiel 1: Angemeldeten Benutzern erlauben, alle Profile zu lesen:

CREATE POLICY "Allow authenticated read access"
ON profiles FOR SELECT
USING ( auth.role() = 'authenticated' );

Beispiel 2: Benutzern erlauben, nur ihr eigenes Profil anzuzeigen:

CREATE POLICY "Allow individual read access"
ON profiles FOR SELECT
USING ( auth.uid() = id ); -- Assumes 'id' column matches the user's UUID from Supabase Auth

Beispiel 3: Benutzern erlauben, nur ihr eigenes Profil zu aktualisieren:

CREATE POLICY "Allow individual update access"
ON profiles FOR UPDATE
USING ( auth.uid() = id ) -- Specifies which rows can be targeted for update
WITH CHECK ( auth.uid() = id ); -- Ensures any *new* data still matches the condition

Beispiel 4: Benutzern erlauben, ihr eigenes Profil einzufügen:

CREATE POLICY "Allow individual insert access"
ON profiles FOR INSERT
WITH CHECK ( auth.uid() = id );

Sie können RLS-Richtlinien direkt im Supabase-Dashboard unter Authentication > Policies anzeigen, erstellen und verwalten.

Wichtige Sicherheitsprinzipien:

  1. Aktivieren Sie RLS immer für Tabellen, auf die über den anon-Schlüssel zugegriffen wird.
  2. Definieren Sie explizite Richtlinien für SELECT, INSERT, UPDATE, DELETE nach Bedarf. Beginnen Sie mit restriktiven Richtlinien und öffnen Sie den Zugriff sorgfältig.
  3. Exponieren Sie niemals den service_role-Schlüssel in clientseitigem Code oder unsicheren Umgebungen.
  4. Verwenden Sie Edge Functions für Operationen, die erhöhte Berechtigungen oder komplexe serverseitige Logik erfordern, und schützen Sie Ihren service_role-Schlüssel innerhalb der sicheren Umgebungsvariablen der Funktion.
  5. Überprüfen Sie regelmäßig Ihre RLS-Richtlinien, um sicherzustellen, dass sie die Sicherheitsanforderungen Ihrer Anwendung erfüllen.

7. Zuordnen von SQL-Konzepten zur Supabase-API (SQL zu API)

Wenn Sie mit SQL vertraut sind, ist es hilfreich zu verstehen, wie gängige SQL-Operationen der Supabase-API (sowohl REST als auch Client-Bibliotheken) zugeordnet werden.

SELECT * FROM my_table;

SELECT column1, column2 FROM my_table WHERE id = 1;

INSERT INTO my_table (column1, column2) VALUES ('value1', 'value2');

UPDATE my_table SET column1 = 'new_value' WHERE id = 1;

DELETE FROM my_table WHERE id = 1;

Joins: Während die direkte SQL-JOIN-Syntax in den grundlegenden REST-Aufrufen nicht verwendet wird, können Sie verwandte Daten mithilfe von Folgendem abrufen:

-- Example SQL function
CREATE FUNCTION get_user_posts(user_id uuid)
RETURNS TABLE (post_id int, post_content text) AS $$
  SELECT posts.id, posts.content
  FROM posts
  WHERE posts.author_id = user_id;
$$ LANGUAGE sql;

8. Verwenden benutzerdefinierter Schemas mit der Supabase-API

Standardmäßig befinden sich Tabellen, die Sie im Supabase SQL-Editor erstellen, im public-Schema. Für eine bessere Organisation, Namensraumverwaltung oder Berechtigungsverwaltung möchten Sie möglicherweise benutzerdefinierte PostgreSQL-Schemas verwenden.

Erstellen eines benutzerdefinierten Schemas:

CREATE SCHEMA private_schema;

Erstellen von Tabellen in einem benutzerdefinierten Schema:

CREATE TABLE private_schema.sensitive_data (
  id serial primary key,
  payload jsonb
);

Zugreifen auf Tabellen in benutzerdefinierten Schemas über die API:

Die PostgREST-Schicht von Supabase erkennt automatisch Tabellen in anderen Schemas als public.

// Accessing a table in 'private_schema' (assuming RLS/permissions allow)
const { data, error } = await supabase
  .from('sensitive_data') // No need to prefix with schema name here
  .select('*')
  .eq('id', 1);

Supabase kümmert sich im Hintergrund um die Zuordnung des Tabellennamens zum richtigen Schema. Stellen Sie sicher, dass Ihre RLS-Richtlinien korrekt auf Tabellen verweisen, wenn sie schemaübergreifende Abfragen oder Funktionen umfassen.

Die Verwendung benutzerdefinierter Schemas ist eine Standard-PostgreSQL-Praxis, die Supabase vollständig unterstützt und eine strukturiertere Datenbankorganisation ermöglicht.

9. Fazit

Die Supabase-API bietet eine bemerkenswert effiziente Möglichkeit, Anwendungen zu erstellen, indem sie sofortigen, sicheren und skalierbaren Zugriff auf Ihre PostgreSQL-Datenbank bietet. Von den automatisch generierten REST-Endpunkten und hilfreichen Client-Bibliotheken bis hin zur robusten Sicherheit, die durch Row Level Security bereitgestellt wird

Explore more

Fathom-R1-14B: Fortschrittliches KI-Argumentationsmodell aus Indien

Fathom-R1-14B: Fortschrittliches KI-Argumentationsmodell aus Indien

Künstliche Intelligenz wächst rasant. FractalAIResearch/Fathom-R1-14B (14,8 Mrd. Parameter) glänzt in Mathe & Logik.

5 June 2025

Cursor 1.0 mit BugBot: KI-gestütztes Automatisierungstest-Tool ist da:

Cursor 1.0 mit BugBot: KI-gestütztes Automatisierungstest-Tool ist da:

Die Softwareentwicklung erlebt Innovationen durch KI. Cursor, ein KI-Editor, erreicht mit Version 1.0 einen Meilenstein.

5 June 2025

30+ öffentliche Web 3.0 APIs, die Sie jetzt nutzen können

30+ öffentliche Web 3.0 APIs, die Sie jetzt nutzen können

Der Aufstieg von Web 3.0: Dezentral, nutzerorientiert, transparent. APIs ermöglichen innovative dApps und Blockchain-Integration.

4 June 2025

Praktizieren Sie API Design-First in Apidog

Entdecken Sie eine einfachere Möglichkeit, APIs zu erstellen und zu nutzen