Skip to content

在微信小程序中使用 Supabase

约 750 字大约 3 分钟

数据库

2025-06-06

wechat node

Supabase 是基于 PostgreSQL 的开源 BaaS(Backend as a Service)平台,提供数据库管理、实时订阅、用户鉴权等功能。其核心优势在于 开源可部署灵活的 API 设计,适合快速构建 MVP 或中小型应用 。 在微信小程序中,由于运行环境限制(如网络请求需使用 wx.request 而非浏览器原生 fetch),直接使用官方 SDK 可能存在兼容性问题。

建立远程数据库

前往 Supabase官网 注册账号、创建数据库与表并插入一些数据,很多网上教程到这一步就直接开始使用 API 访问数据库了,如果照做了那就是踩坑的开始。

Supabase 有身份验证机制,若创建表后直接使用 API 进行 SELECT 访问,会得到状态码虽为 200 但 data 是空的数据,因为你没有访问权限。

需要进入你创建的项目,点击 Authentication,点击 Policies 菜单项为表创建规则。可以点击右边的规则选项快速创建规则:对所有用户开放可读权限、对登录用户开启插入权限..., 创建好规则后便可根据文档说明使用API进行访问。

三个 SDK 包的差异

1. @supabase/supabase-js

官方标准 SDK,适用于 Web、Node.js 等环境。支持 REST API 和 Realtime API,文档丰富,功能完整;但如果需要

  • 优势:功能完整,支持 REST API 和 Realtime API,文档丰富 。
  • 局限性
    • 微信小程序中需手动适配网络层(如替换 fetchwx.request)。
    • 不支持小程序特有功能(如云数据库联动)。
// 官方 SDK 基础用法  
import { createClient } from '@supabase/supabase-js';  
const supabase = createClient('YOUR_SUPABASE_URL', 'YOUR_ANON_KEY');  

// 查询数据  
const { data, error } = await supabase.from('users').select('*');

2. supabase-wechat-stable(v1 适配包)

专为微信小程序优化的社区适配包,解决官方 SDK 的兼容性问题。

  • 核心改进
    • 使用 wx.request 作为底层网络请求。
    • 支持小程序环境下的 Token 持久化存储(如 wx.setStorageSync)。
  • 适用场景:需快速在小程序中集成 Supabase,但无需复杂实时功能的项目 。
// v1 适配包用法  
const { createClient } = require('supabase-wechat-stable');  
const supabase = createClient('YOUR_SUPABASE_URL', 'YOUR_ANON_KEY');  

// 查询数据(与官方 SDK 一致)  
const { data, error } = await supabase.from('users').select('*');

3. supabase-wechat-stable-v2(升级版 v2)

v2 版本在 v1 基础上新增以下功能

  1. 实时订阅增强
    • 支持 WebSocket 实时监听数据库变更(需配置 Supabase 实时服务)。
    • 提供小程序端的 onSubscriptionUpdate 回调接口。
  2. 云函数集成
    • 支持调用微信云开发的云函数,实现 Supabase 与微信生态联动。
// v2 适配包实时订阅示例  
const { createClient } = require('supabase-wechat-stable-v2');  
const supabase = createClient('YOUR_SUPABASE_URL', 'YOUR_ANON_KEY');  

// 实时监听 users 表更新  
supabase  
  .from('users')  
  .on('INSERT', (payload) => {  
    console.log('New user added!', payload);  
  })  
  .subscribe();