使用 Supabase

使用 Supabase 将 Postgres 数据库和用户身份验证添加到你的 React Native 应用。

苏帕贝斯 是一个后端即服务 (BaaS) 应用开发平台，提供托管后端服务，例如 Postgres 数据库、用户身份验证、文件存储、边缘功能、实时同步以及矢量和 AI 工具包。它是 Google Firebase 的开源替代品。

¥Supabase is a Backend-as-a-Service (BaaS) app development platform that provides hosted backend services such as a Postgres database, user authentication, file storage, edge functions, realtime syncing, and a vector and AI toolkit. It's an open-source alternative to Google's Firebase.

Supabase 自动从你的数据库中进行 生成 REST API，并采用名为 行级安全性 (RLS) 的概念来保护你的数据，从而可以从 React Native 应用直接与数据库进行交互，而无需通过服务器！

¥Supabase automatically generates a REST API from your database and employs a concept called row level security (RLS) to secure your data, making it possible to directly interact with your database from your React Native application without needing to go through a server!

Supabase 提供了一个名为 supabase-js 的 TypeScript 客户端库来与 REST API 进行交互。或者，Supabase 还公开了 GraphQL API，允许你根据需要使用你最喜欢的 GraphQL 客户端（例如 Apollo 客户端）。

¥Supabase provides a TypeScript client library called supabase-js to interact with the REST API. Alternatively, Supabase also exposes a GraphQL API allowing you to use your favorite GraphQL client (for example, Apollo Client) should you wish to.

先决条件

¥Prerequisites

前往 database.new 创建一个新的 Supabase 项目。

¥Head over to database.new to create a new Supabase project.

获取 API 密钥

¥Get the API Keys

从 API 设置中获取项目 URL 和 anon 密钥。

¥Get the Project URL and anon key from the API settings.

1. 转到仪表板中的 API 设置 页面。

   ¥Go to the API Settings page in the Dashboard.

2. 在此页面上找到你的项目 URL、anon 和 service_role 密钥。

   ¥Find your Project URL, anon, and service_role keys on this page.

使用 Supabase TypeScript SDK

¥Using the Supabase TypeScript SDK

使用 supabase-js 是充分利用 Supabase 堆栈功能的最便捷方式，因为它可以方便地将所有不同的服务（数据库、身份验证、实时、存储、边缘功能）组合在一起。

¥Using supabase-js is the most convenient way of leveraging the full power of the Supabase stack as it conveniently combines all the different services (database, auth, realtime, storage, edge functions) together.

安装并初始化 Supabase TypeScript SDK

¥Install and initialize the Supabase TypeScript SDK

import 'react-native-url-polyfill/auto';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { createClient } from '@supabase/supabase-js';

const supabaseUrl = YOUR_REACT_NATIVE_SUPABASE_URL;
const supabaseAnonKey = YOUR_REACT_NATIVE_SUPABASE_ANON_KEY;

export const supabase = createClient(supabaseUrl, supabaseAnonKey, {
  auth: {
    storage: AsyncStorage,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  },
});

下一步

¥Next steps