@ capgo/ 电容器- supabase

使用您的 Capacitor 应用程序中的本地 SDK 进行认证和数据库呼叫, 并获取您的网页层的 JWT .

🤖 建筑与AI编码代理? 安装 Capgo 技能 所以克劳德代码,代码,光标,副驾驶,或双子座CLI知道如何安装和使用 @capgo/capacitor-supabase 在您的电容应用程序中: npx skills add Cap-go/capgo-skills。然后问你的经纪人: 将@capgo/capor-supabase 添加到我的Capacitor app上,并把它连接起来。" 代理设置指南 • 妇女 主机磁共振

主要特点

• 认证方法电子邮件和密码、注册、匿名、OAuth供应商和检察官办公室 verifyOtp()。 。 。 .
• 会议数字 : getSession(), (中文(简体) ), refreshSession(), (中文(简体) ), setSession(), (中文(简体) ), getUser() 财务报告和审定财务报表 signOut(),与 authStateChange 活动.
• JWT 访问: 会话包括您自己的 API 电话的访问符 .
• 数据库数字 : select(), (中文(简体) ), insert(), (中文(简体) ), update() 财务报告和审定财务报表 delete() 在你们的桌子上.
• 原生 SDKs: iOS上的supabase-swift和Android上的supabase-kt. 互联网档案馆的存檔,存档日期2014-12-02.
• 平台: iOS和Android. 互联网档案馆的存檔,存档日期2013-12-21. 在网络上, 使用 @supabase/supabase-js 直接说.

为什么是Supabase队长?

本地 SDK 组合 真实本地认证 使用 JWT 令牌访问您的 Capactor 应用程序 :

• 本地 SDK 整合 - 全面访问Supabase的本地iOS和Android SDKs
• JWT 令牌访问 - 从本地认证获取 JWT 令牌供 JavaScript/ web 层使用
• 完整认证方法 - 电子邮件/密码、OAuth、OTP、魔法链接等等
• 会话管理 - 以自动刷新方式处理本地会话
• 数据库操作 - Supabase表格的本地CRUD操作
• Auth 状态听众 - 实时认证状态变化事件
• 混合办法 - 数据库查询使用带有 supabase-js 的本地认证
• 自由和开放源代码 - 不需要有偿服务

适合需要安全本土认证的应用程序,同时利用Supabase强大的后端服务.

为什么只有Auth和基本的DB操作? Supabase JS SDK已经在Capacitor为大多数特性(Realtime,存储,边缘函数等)做了出色的工作. 为每个特点建造本土桥梁将增加复杂性,而没有实际好处。 此插件的焦点 认证 当地SDK提供实际价值(安全信使存储、OAuth流量、生物鉴别)。 其它的,只要使用 @supabase/supabase-js 与来自本地的JWT .

为什么不把所有东西都从本土连接起来呢?

• 无业绩收益 - 桥面(JSON系列化/JSON与原住地之间的隔离)否定了跳过HTTP飞行前请求的任何好处。 你只是把转换成本从网络转移到CPU.
• 类型安全问题 – 原始SDK需要每张桌子/平地打入型号. 您需要定义 Swift/Kotlin 类型 用于您的整个数据库计划并保持同步 。 与JS,你得到动态打字 刚刚工作.
• 赡养负担 - 每一次Supabase SDK更新都需要更新3个代码库(JS,iOS,Android)而不只是一个. JS SDK已经得到了Supabase的妥善维护.

文档

这里有最完整的医生: https://capgo.app/docs/plugins/supabase/ 页面存档备份,存于互联网档案馆

兼容性

说明: 此插件的主要版本沿用了Capacitor的主要版本. 使用匹配您的 Capacitor 安装的版本( 如 Capacitor 8 的插件 v8) 。 只有最新的主要版本得到积极维护.

安装

您可以使用我们的 AI 辅助设置安装插件 。 使用以下命令将 Capgo 技能添加到您的 AI 工具 :

npx skills add https://github.com/cap-go/capacitor-skills --skill capacitor-plugins

然后使用下列提示:

Use the `capacitor-plugins` skill from `cap-go/capacitor-skills` to install the `@capgo/capacitor-supabase` plugin in my project.

如果您更喜欢手动设置,请通过运行以下命令来安装插件,并遵循下面的平台特定指令:

npm install @capgo/capacitor-supabase
npx cap sync

iOS 设置

不需要额外设置。 插件使用 Swift 套件管理器包含 Supabase Swift SDK.

Android 设置

插件要求最低SDK为26 (Android 8.0). 保证你 android/variables.gradle 拥有:

minSdkVersion = 26

使用量

初始化客户端

import { CapacitorSupabase } from '@capgo/capacitor-supabase';

await CapacitorSupabase.initialize({
  supabaseUrl: 'https://your-project.supabase.co',
  supabaseKey: 'your-anon-key'
});

认证

签名 用电子邮件/密码输入

const { session, user } = await CapacitorSupabase.signInWithPassword({
  email: '[email protected]',
  password: 'password123'
});

// Access the JWT token
console.log('JWT:', session?.accessToken);

注册

const { session, user } = await CapacitorSupabase.signUp({
  email: '[email protected]',
  password: 'password123',
  data: { name: 'John Doe' }
});

匿名签名

const { session, user } = await CapacitorSupabase.signInAnonymously();
console.log('Anonymous user ID:', user?.id);

OAuth 签名

await CapacitorSupabase.signInWithOAuth({
  provider: 'google',
  redirectTo: 'myapp://callback'
});

检察官办公室签名

// Send OTP
await CapacitorSupabase.signInWithOtp({
  email: '[email protected]'
});

// Verify OTP
const { session, user } = await CapacitorSupabase.verifyOtp({
  email: '[email protected]',
  token: '123456',
  type: 'email'
});

签出

await CapacitorSupabase.signOut();

会话管理

获取当前会话

const { session } = await CapacitorSupabase.getSession();
if (session) {
  console.log('JWT:', session.accessToken);
  console.log('Refresh Token:', session.refreshToken);
  console.log('Expires At:', session.expiresAt);
}

刷新会话

const { session } = await CapacitorSupabase.refreshSession();

获取当前用户

const { user } = await CapacitorSupabase.getUser();
if (user) {
  console.log('User ID:', user.id);
  console.log('Email:', user.email);
}

手动设定会话

const { session } = await CapacitorSupabase.setSession({
  accessToken: 'eyJ...',
  refreshToken: 'abc123'
});

收听 Auth 状态更改

const listener = await CapacitorSupabase.addListener(
  'authStateChange',
  ({ event, session }) => {
    console.log('Auth event:', event);
    // Events: INITIAL_SESSION, SIGNED_IN, SIGNED_OUT, TOKEN_REFRESHED, USER_UPDATED
    if (session) {
      console.log('JWT:', session.accessToken);
    }
  }
);

// Later, remove the listener
listener.remove();

使用带有 @supabase/ supabase-js的 JWT

主要使用案例是从本地认证获取JWT,并与JavaScript Supabase客户端使用:

import { createClient } from '@supabase/supabase-js';
import { CapacitorSupabase } from '@capgo/capacitor-supabase';

// Initialize native client
await CapacitorSupabase.initialize({
  supabaseUrl: 'https://your-project.supabase.co',
  supabaseKey: 'your-anon-key'
});

// Sign in natively
await CapacitorSupabase.signInWithPassword({
  email: '[email protected]',
  password: 'password'
});

// Get session with JWT
const { session } = await CapacitorSupabase.getSession();

// Create JS client with the native session
const supabase = createClient(
  'https://your-project.supabase.co',
  'your-anon-key',
  {
    global: {
      headers: {
        Authorization: `Bearer ${session?.accessToken}`
      }
    }
  }
);

// Now use supabase-js as normal
const { data } = await supabase.from('table').select('*');

数据库操作( Native)

插件还支持本地数据库操作 :

选择

const { data, error } = await CapacitorSupabase.select({
  table: 'users',
  columns: 'id, name, email',
  filter: { active: true },
  limit: 10,
  orderBy: 'created_at',
  ascending: false
});

插入

const { data, error } = await CapacitorSupabase.insert({
  table: 'posts',
  values: { title: 'Hello', content: 'World' }
});

更新

const { data, error } = await CapacitorSupabase.update({
  table: 'posts',
  values: { title: 'Updated Title' },
  filter: { id: 1 }
});

删除

const { data, error } = await CapacitorSupabase.delete({
  table: 'posts',
  filter: { id: 1 }
});

API 密码

• initialize(...)
• signInWithPassword(...)
• signUp(...)
• signInAnonymously()
• signInWithOAuth(...)
• signInWithOtp(...)
• verifyOtp(...)
• signOut()
• getSession()
• refreshSession()
• getUser()
• setSession(...)
• addListener('authStateChange', ...)
• removeAllListeners()
• select(...)
• insert(...)
• update(...)
• delete(...)
• getPluginVersion()
• 接口
• 类型异名

用于本地Supabase SDK整合的 Capacitor Supabase插件.

此插件提供了本地iOS和Android Supabase SDK功能 具有检索JWT 令牌用于JavaScript/web层的能力.

初始化(...)

initialize(options: SupabaseConfig) => Promise<void>

以您的项目证书初始化 Supabase 客户端 . 在使用其他方法之前必须先打电话.

自: 0.0.1 资源

签名 With Password (...)

signInWithPassword(options: SignInWithPasswordOptions) => Promise<AuthResult>

用电子邮件和密码签名 .

回返情况: Promise<AuthResult>

自: 0.0.1 资源

注册(...)

signUp(options: SignUpOptions) => Promise<AuthResult>

注册有电子邮件和密码的新用户 .

回返情况: Promise<AuthResult>

自: 0.0.1 资源

匿名签名 ()

signInAnonymously() => Promise<AuthResult>

匿名签名. 创建临时的来宾会话,不需要证书.

回返情况: Promise<AuthResult>

自: 0.0.1 资源

签名 WithOAuth (...)

signInWithOAuth(options: SignInWithOAuthOptions) => Promise<void>

与OAuth供应商签约. 打开提供者的认证页面.

自: 0.0.1 资源

签名 InWithOtp (...)

signInWithOtp(options: SignInWithOtpOptions) => Promise<void>

与通过电子邮件或短信发送的OTP(一次性密码)签约.

自: 0.0.1 资源

校验 Otp (...)

verifyOtp(options: VerifyOtpOptions) => Promise<AuthResult>

检查一个检察官办公室的标志.

回返情况: Promise<AuthResult>

自: 0.0.1 资源

符号输出( C)

signOut() => Promise<void>

签名当前用户 .

自: 0.0.1 资源

获取会议( C)

getSession() => Promise<{ session: Session | null; }>

如果存在的话, 请访问当前会话 . 用 JWT 访问符返回会话 .

回返情况: Promise<{ session: Session | null; }>

自: 0.0.1 资源

刷新会议( )

refreshSession() => Promise<{ session: Session | null; }>

刷新当前会话并获取新符号 .

回返情况: Promise<{ session: Session | null; }>

自: 0.0.1 资源

获取用户 ()

getUser() => Promise<{ user: User | null; }>

获取当前认证的用户 .

回返情况: Promise<{ user: User | null; }>

自: 0.0.1 资源

设置会议(...)

setSession(options: SetSessionOptions) => Promise<{ session: Session | null; }>

手动设定会话带有访问权限并刷新符号 . 用于恢复会话或与外部认证合并 .

回返情况: Promise<{ session: Session | null; }>

自: 0.0.1 资源

添加倾听器( “ 自动状态变化 ” ,...)

addListener(eventName: 'authStateChange', listenerFunc: (data: AuthStateChange) => void) => Promise<PluginListenerHandle>

聆听认证状态的更改 .

回返情况: Promise<PluginListenerHandle>

自: 0.0.1 资源

删除所有收听器( )

removeAllListeners() => Promise<void>

删除所有用于认证状态更改的听众 .

自: 0.0.1 资源

选择(...)

select<T = unknown>(options: SelectOptions) => Promise<QueryResult<T[]>>

在表格中执行 SELECT 查询 .

回返情况: Promise<QueryResult<T[]>>

自: 0.0.1 资源

插入(...)

insert<T = unknown>(options: InsertOptions) => Promise<QueryResult<T>>

将数据插入表格.

回返情况: Promise<QueryResult<T>>

自: 0.0.1 资源

更新(...)

update<T = unknown>(options: UpdateOptions) => Promise<QueryResult<T>>

更新表格中的数据.

回返情况: Promise<QueryResult<T>>

自: 0.0.1 资源

删除(...)

delete<T = unknown>(options: DeleteOptions) => Promise<QueryResult<T>>

删除表格中的数据.

回返情况: Promise<QueryResult<T>>

自: 0.0.1 资源

获取 PluginVersion ()

getPluginVersion() => Promise<{ version: string; }>

获取本地 Capacitor 插件版本 .

回返情况: Promise<{ version: string; }>

自: 0.0.1 资源

接口

Supabase 配置

初始化Supabase客户端的配置选项 .

认证结果

返回会话的认证操作的结果 .

会议

会议 包含认证符号的对象.

用户

用户 从认证操作返回对象.

以 Password 选项签名

电子邮件/密码签名选项 .

签名选项

电子邮件/密码输入选项 .

以 Outh 选项签名

OAuth 登录的选项 .

以 Otp 选项签名

检察官办公室的登录选项.

校验 Otp 选项

核查检察官办公室的选项.

设定会议选项

手动设置会话的选项 .

插件听筒

Auth State 变化

认证状态更改回调数据 .

查询结果

数据库查询结果.

选择选项

用于选择查询的数据库选项.

插入选项

数据库插入查询选项.

更新选项

数据库更新查询的选项 .

删除选项

数据库删除查询的选项 .

类型异名

记录

构造 T 类型 K 的一组属性类型

{ [P in K]: T; }

提供认证

支持 OAuth 供应商 .

'apple' | 'azure' | 'bitbucket' | 'discord' | 'facebook' | 'figma' | 'github' | 'gitlab' | 'google' | 'kakao' | 'keycloak' | 'linkedin' | 'linkedin_oidc' | 'notion' | 'slack' | 'slack_oidc' | 'spotify' | 'twitch' | 'twitter' | 'workos' | 'zoom'

AuthChangeEvent 活动

Auth 状态更改事件类型 .

'INITIAL_SESSION' | 'SIGNED_IN' | 'SIGNED_OUT' | 'TOKEN_REFRESHED' | 'USER_UPDATED' | 'PASSWORD_RECOVERY'

许可证

MPL - 2.0 导弹