云信AI部署

探索GitHub顶级项目：Supabase在Arch Linux平台的实战应用

云信安装大师
90
AI 质量分
11 5 月, 2025
4 分钟阅读
0 阅读

探索GitHub顶级项目：Supabase在Arch Linux平台的实战应用

引言

Supabase是一个开源的Firebase替代品，提供数据库、认证、存储等后端服务。作为GitHub上的顶级开源项目，它凭借PostgreSQL的强大功能和易用性吸引了大量开发者。本文将带你在Arch Linux系统上完整部署和使用Supabase。

准备工作

环境要求

  • Arch Linux系统（已更新至最新版本）
  • Docker和Docker Compose（Supabase官方推荐方式）
  • Node.js（可选，用于前端开发）
  • Git（用于克隆示例仓库）

安装必要工具

代码片段 
# 更新系统
sudo pacman -Syu

# 安装Docker和Docker Compose
sudo pacman -S docker docker-compose

# 启动Docker服务并设置开机自启
sudo systemctl start docker
sudo systemctl enable docker

# 将当前用户加入docker组（需重新登录生效）
sudo usermod -aG docker $USER

第一步：部署Supabase本地开发环境

1.1 克隆Supabase仓库

代码片段 
git clone --depth 1 https://github.com/supabase/supabase
cd supabase/docker

注意：--depth 1参数只克隆最新提交，节省下载时间

1.2 复制环境变量文件并编辑

代码片段 
cp .env.example .env
nano .env

修改以下关键配置：

代码片段 
POSTGRES_PASSWORD=your_secure_password_here
JWT_SECRET=your_jwt_secret_here
SITE_URL=http://localhost:3000 # 前端URL
ADDITIONAL_REDIRECT_URLS=http://localhost:3000/auth/callback # OAuth回调URL

1.3 启动Supabase服务

代码片段 
docker-compose up -d

这个命令会启动以下服务：
– PostgreSQL数据库（端口5432）
– PostgREST API（端口3000）
– Kong API网关（端口8000）
– Studio管理界面（端口3000）
– Realtime服务（端口4000）

经验分享：首次启动可能需要5-10分钟下载镜像，取决于网络速度

第二步：访问Supabase管理界面

在浏览器中打开：

代码片段 
http://localhost:3000

你应该能看到Supabase Studio界面。首次访问需要创建管理员账户：

  1. 点击”Create a new project”
  2. 输入项目名称和数据库密码（与.env中一致）
  3. 等待初始化完成（约2分钟）

第三步：创建第一个数据库表并测试API

3.1 使用SQL编辑器创建表

在Studio左侧导航栏选择”SQL Editor”，执行以下SQL：

代码片段 
-- 创建示例表：博客文章
CREATE TABLE posts (
    id SERIAL PRIMARY KEY,
    title TEXT NOT NULL,
    content TEXT,
    created_at TIMESTAMP DEFAULT NOW(),
    is_published BOOLEAN DEFAULT FALSE
);

-- 启用行级安全策略(RLS)
ALTER TABLE posts ENABLE ROW LEVEL SECURITY;

-- 为posts表创建策略：允许所有人读取已发布的文章
CREATE POLICY "Allow public read access" 
ON posts FOR SELECT 
USING (is_published = true);

3.2 JavaScript客户端测试示例

创建一个新的Node.js项目进行测试：

代码片段 
mkdir supabase-test && cd supabase-test
npm init -y
npm install @supabase/supabase-js dotenv --save
touch index.js .env test.html

编辑.env文件：

代码片段 
SUPABASE_URL=http://localhost:8000 # Kong API网关地址，不是Studio地址！
SUPABASE_KEY=your-anon-key # Studio -> Settings -> API -> anon public key获取此值

编辑index.js：

代码片段 
require('dotenv').config();
const { createClient } = require('@supabase/supabase-js');

const supabaseUrl = process.env.SUPABASE_URL;
const supabaseKey = process.env.SUPABASE_KEY;
const supabase = createClient(supabaseUrl, supabaseKey);

async function testSupabase() {
    // 插入数据测试 (需要关闭RLS或使用服务端密钥)
    const { data, error } = await supabase.from('posts').insert([
        { title: 'Hello Supa', content: 'My first post', is_published: true },
        { title: 'Draft post', content: 'Not published yet' }
    ]);

    if (error) console.error('Insert error:', error);
    else console.log('Insert success:', data);

    // 查询数据测试 (可以使用anon key)
    const { data: posts, error: queryError } = await supabase.from('posts').select('*').eq('is_published', true);

    if (queryError) console.error('Query error:', queryError);
    else console.log('Published posts:', posts);
}

testSupabase();

运行测试脚本：

代码片段 
node index.js

Web前端快速示例

编辑test.html：

代码片段 
<!DOCTYPE html>
<html>
<head>
    <title>Supabase Test</title>
    <script src="https://unpkg.com/@supabase/supabase-js@2"></script>
</head>
<body>
    <h1>Published Posts</h1>
    <ul id="posts"></ul>

    <script>
        const supabaseUrl = 'http://localhost:8000';
        const supabaseKey = 'your-anon-key'; // Studio -> Settings -> API

        const supabase = supabase.createClient(supabseUrl, supabseKey);

        async function loadPosts() {
            const { data, error } = await supabse.from('posts')
                .select('*')
                .eq('is_published', true);

            if (error) {
                console.error(error); 
                return;
            }

            const list = document.getElementById('posts');
            data.forEach(post => {
                const item = document.createElement('li');
                item.textContent = `${post.title} - ${new Date(post.created_at).toLocaleString()}`;
                list.appendChild(item);
            });
        }

        loadPosts();
    </script>
</body>
</html>

Arch Linux特有注意事项

  1. 防火墙配置：

    代码片段 
    sudo ufw allow from any to any port postgresql # PostgreSQL默认5432端口  
sudo ufw allow from any to any port http # Studio默认3000端口  
sudo ufw enable

  2. 性能优化：

    代码片段 
    # Docker默认使用cgroupfs驱动，建议改用systemd驱动  
echo '{"exec-opts": ["native.cgroupdriver=systemd"]}' | sudo tee /etc/docker/daemon.json  
sudo systemctl restart docker

  3. 存储位置修改：

    代码片段 
    # Arch Linux默认将Docker数据存储在/var/lib/docker  
# SSD用户可考虑迁移到更合适的位置  
sudo systemctl stop docker  
sudo rsync -avz /var/lib/docker /new/location/  
sudo mv /var/lib/docker /var/lib/docker.bak  
sudo ln -s /new/location/docker /var/lib/docker  
sudo systemctl start docker

Supabse高级功能探索

Realtime订阅示例

修改之前的JavaScript代码添加实时订阅功能：

代码片段 
// ...之前代码...

// Realtime订阅示例  
const subscription = supabse.channel('public:posts') // "public"是schema名  
.on( 
'postgres_changes',
{ event: '*', schema: 'public', table: 'posts' },
(payload) => console.log('Change received!', payload)
).subscribe()

// ...之后代码...  

// Remember to unsubscribe when done:
// subscription.unsubscribe()

Storage存储功能

在SQL Editor中启用存储功能：

代码片段 
-- Enable the storage extension in PostgreSQL 
CREATE EXTENSION IF NOT EXISTS pg_cron; 

-- Create a bucket for user uploads 
INSERT INTO storage.buckets (id, name) VALUES ('user_uploads', 'User Uploads'); 

-- Set permissions (allow authenticated users to upload) 
CREATE POLICY "Allow uploads" ON storage.objects FOR INSERT TO authenticated WITH CHECK (bucket_id = 'user_uploads');

JavaScript上传示例：

代码片段 
async function uploadFile(file) {
const { data, error } = await supabse.storage.from('user_uploads').upload(`public/${file.name}`, file)

if (error) throw error;
return data.path;
}

Troubleshooting常见问题

Q1: docker-compose up时报错端口冲突？
A1: Arch Linux可能已有服务占用某些端口，修改.env中的端口配置或停止相关服务。

Q2: Studio无法连接数据库？
A2:
1.检查.env中的POSTGRES_PASSWORD是否与创建项目时一致
2.确保Docker容器正常运行:docker ps -a查看状态
3.检查日志:docker logs [container_id]

Q3: API请求返回401未授权？
A3:
1.确保使用了正确的anon key(Studio->Settings->API)
2.RLS行级安全策略可能阻止了操作，可在Studio的Table Editor中临时关闭RLS测试

Clean Up清理资源

停止并删除所有容器和数据(开发环境):

代码片段 
cd ~/supabse/docker 
docker-compose down --volumes # --volumes会删除所有数据！谨慎使用！ 

# To completely remove the images:
docker rmi $(docker images -q) -f 

# Remove unused networks etc:
docker system prune -a --volumes

Conclusion总结

通过本文你学会了在Arch Linux上:
✅部署完整的本地Supabse开发环境
✅创建数据库表和设置安全策略
✅通过JavaScript客户端进行CRUD操作
✅实现实时数据更新功能
✅处理常见问题和优化配置

下一步建议:
•探索用户认证功能(Auth模块)
•集成到你的Next.js/Nuxt.js等前端框架中
•研究PostgreSQL高级特性如存储过程、触发器

Happy coding with Supabse on Arch! 🐧🚀

原创 高质量