如何在Flutter项目中使用supabase-flutter集成Supabase

我正在尝试在我的Flutter项目中集成Supabase，使用了supabase-flutter插件，但遇到了一些问题。首先，在初始化Supabase客户端时，我应该如何正确配置URL和anon key？其次，进行用户认证时，注册和登录功能总是返回错误，不知道是不是我的配置有问题。另外，我想实现数据实时订阅功能，但不太清楚如何正确设置stream监听。有没有完整的示例代码可以参考？还有，在开发和生产环境中，Supabase的安全规则应该如何配置比较合理？希望有经验的朋友能分享一下具体的实现步骤和注意事项。

2 回复

在Flutter项目中使用supabase-flutter集成Supabase：

  1. 添加依赖：flutter pub add supabase_flutter
  2. 初始化：在main.dart中配置Supabase URL和anon key
  3. 使用：导入包后即可调用Supabase客户端进行数据库操作

示例：

await Supabase.instance.client
  .from('todos')
  .select()

更多关于如何在Flutter项目中使用supabase-flutter集成Supabase的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter项目中集成Supabase，可以使用supabase-flutter包实现。以下是详细步骤：

1. 添加依赖

在 pubspec.yaml 文件中添加依赖：

dependencies:
  supabase_flutter: ^2.0.0

运行 flutter pub get 安装包。

2. 初始化Supabase

在 main.dart 中初始化Supabase客户端：

import 'package:supabase_flutter/supabase_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  await Supabase.initialize(
    url: 'YOUR_SUPABASE_URL',
    anonKey: 'YOUR_SUPABASE_ANON_KEY',
  );
  
  runApp(MyApp());
}

3. 基本使用示例

认证功能：

// 注册
await Supabase.instance.client.auth.signUp(
  email: 'user@example.com',
  password: 'password',
);

// 登录
final response = await Supabase.instance.client.auth.signInWithPassword(
  email: 'user@example.com',
  password: 'password',
);

// 获取当前用户
final user = Supabase.instance.client.auth.currentUser;

数据库操作：

// 查询数据
final data = await Supabase.instance.client
  .from('posts')
  .select()
  .execute();

// 插入数据
await Supabase.instance.client
  .from('posts')
  .insert({
    'title': 'Hello World',
    'content': 'My first post',
  });

// 更新数据
await Supabase.instance.client
  .from('posts')
  .update({'title': 'Updated Title'})
  .eq('id', 1);

// 删除数据
await Supabase.instance.client
  .from('posts')
  .delete()
  .eq('id', 1);

4. 实时订阅

final subscription = Supabase.instance.client
  .from('posts')
  .on(SupabaseEventTypes.all, (payload) {
    print('Change received: ${payload}');
  })
  .subscribe();

5. 文件存储

// 上传文件
await Supabase.instance.client.storage
  .from('avatars')
  .upload('user1.jpg', fileBytes);

// 下载文件
final String url = Supabase.instance.client.storage
  .from('avatars')
  .getPublicUrl('user1.jpg');

重要提示：

  • 从Supabase项目设置中获取URL和anonKey
  • 处理认证状态变化时可监听auth状态
  • 在生产环境中妥善保管密钥
  • 建议使用环境变量存储敏感信息

这样就能在Flutter应用中完整集成Supabase的后端服务了。

回到顶部