Discussbase论坛

Discussbase是一个开源的简单论坛。使用“技术栈”（MemFire Cloud 、 Nextjs）构建和运行。

img

下载代码

执行如下命令，获取Discussbase论坛应用的代码。

git clone https://github.com/LucaRao/discussbase

创建应用

下载Discussbase代码后，登录memfire cloud,创建一个MemFire Cloud应用，为Discussbase提供后端服务，包括云数据库、对象存储、授权认证等。

img

在应用->概括页面，获取服务地址以及token信息。

img

Anon（公开）密钥是客户端API密钥。它允许“匿名访问”您的数据库，直到用户登录。登录后，密钥将切换到用户自己的登录令牌。这将为数据启用行级安全性。

注意：service_role（秘密）密钥可以绕过任何安全策略完全访问您的数据。这些密钥必须保密，并且要在服务器环境中使用，决不能在客户端或浏览器上使用。 在后续示例代码中，需要提供supabaseUrl和supabaseKey。

配置访问密钥

在根目录下创建新的 .env文件，在 .env 中添加您的 MemFire Cloud 配置；将上一步中获取的Anon（公开）密钥、service_role和网址、以及JWT密钥分别设置到该文件中，如下图所示：

1NEXT_PUBLIC_SUPABASE_URL=
2NEXT_PUBLIC_SUPABASE_ANON_KEY=
3JWT_SECRET=
4NEXT_PUBLIC_SUPABASE_SERVICE_KEY=

如图样例所示。

img

创建数据表

接下来我们会创建三张表，包括

  • profiles (用户信息表)

  • posts (帖子)

  • replies (回复信息表)

创建profiles表#

你可以在MemFire Cloud的Discussbase_db的SQL编辑器运行如下SQL语法，涉及操作包括：

1、创建profiles表, 开启Profiles的RLS数据安全访问规则;

其中profiles表字段id和auth.users表中的uuid外键关联。

相关操作的SQL命令：

1-- Create a table for Public Profiles
2create table profiles (
3  id uuid references auth.users not null,
4  updated_at timestamp with time zone,
5  username text unique not null,
6  avatar_url text,
7  website text,
8  point INTEGER DEFAULT 0,
9  primary key (id),
10  unique(username),
11  constraint username_length check (char_length(username) >= 3)
12);
13
14alter table profiles enable row level security;

2、允许每个用户可以查看公共的个人信息资料, 仅允许用户增删改查本人的个人资料信息；

相关操作的SQL命令：

1
2create policy "Public profiles are viewable by everyone."
3  on profiles for select
4  using ( true );
5
6create policy "Users can insert their own profile."
7  on profiles for insert
8  with check ( auth.uid() = id );
9
10create policy "Users can update own profile."
11  on profiles for update
12  using ( auth.uid() = id );

创建avatars存储桶#

创建对象存储的存储桶，用来存储用户的头像图片，涉及操作包括：

1、创建一个存储桶avatars

在该应用的对象存储导航栏，点击“新建Bucket”按钮，创建存储桶avatars。

img

2、允许每个用户可以查看、上传、更新存储桶avatars；

相关操作的SQL命令：

1-- Set up Storage!
2insert into storage.buckets (id, name)
3values ('avatars', 'avatars');
4
5create policy "Avatar are public accessible."
6  on storage.objects for select
7  using ( bucket_id = 'avatars' );
8
9create policy "Everyone can upload an avatar."
10  on storage.objects for insert
11  with check ( bucket_id = 'avatars' );
12
13create policy "Everyone can update an avatar."
14  on storage.objects for update
15  with check ( bucket_id = 'avatars' );

创建posts表#

你可以在MemFire Cloud的Discussbase_db的SQL编辑器运行如下SQL语法，涉及操作包括：

1、 创建posts表，开启posts的RLS数据安全访问规则；

其中posts表字段user_id和public.profiles表中的id外键关联。

1CREATE TABLE posts (
2  id SERIAL PRIMARY KEY,
3  user_id uuid not null,
4  title text not null,
5  body text not null,
6  slug text not null,
7  tag text not null,
8  vote INTEGER DEFAULT 0,
9created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
10updated_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
11CONSTRAINT fk_user
12      FOREIGN KEY(user_id) 
13      REFERENCES profiles(id)
14      ON DELETE SET NULL
15);
16
17alter table posts enable row level security;

2、允许每个用户增删改查帖子；允许所有的用户都可以查看全部的帖子；

相关操作的SQL命令：

1
2create policy "Individuals can create posts." on posts for
3    insert with check (auth.uid() = user_id);
4
5create policy "Individuals can update their own posts." on posts for
6    update using (auth.uid() = user_id);
7
8create policy "Individuals can delete their own posts." on posts for
9    delete using (auth.uid() = user_id);
10
11create policy "Posts are public." on posts for
12    select using (true);

创建replies表#

你可以在MemFire Cloud的Discussbase_db的SQL编辑器运行如下SQL语法，涉及操作包括：

1、创建replies表；开启replies的RLS数据安全访问规则；

其中replies表字段user_id和public.profiles表中的id外键关联。

其中replies表字段post_id和public.posts表中的id外键关联。

相关操作的SQL命令：

1CREATE TABLE replies (
2  id SERIAL PRIMARY KEY,
3  body text,
4  user_id uuid not null,
5  post_id int8,
6  vote INTEGER DEFAULT 0,
7  created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
8  updated_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
9  CONSTRAINT fk_post
10      FOREIGN KEY(post_id) 
11      REFERENCES posts(id)
12      ON DELETE SET NULL,
13        CONSTRAINT fk_user
14      FOREIGN KEY(user_id) 
15      REFERENCES profiles(id)
16      ON DELETE SET NULL
17);
18
19alter table replies enable row level security;

2、允许每个用户增删改查回复信息；允许所有的用户都可以查看全部的帖子回复信息；

相关操作的SQL命令：

1
2create policy "Individuals can create replies." on replies for
3    insert with check (auth.uid() = user_id);
4
5create policy "Individuals can update their own replies." on replies for
6    update using (auth.uid() = user_id);
7
8create policy "Individuals can delete their own replies." on replies for
9    delete using (auth.uid() = user_id);
10
11create policy "replies are public." on replies for
12    select using (true);

运行程序

1node -v  #v16.15.1
2npm config set registry https://registry.npm.taobao.org
3npm install
4npm run dev

在浏览器中打开链接，即可查看如下页面。

img

认证设置，使用本地的IP地址来替换认证设置中的网址。

img

点击登录页面，如下图所示，输入注册邮箱，应用会发送确认注册邮件。登录注册邮箱后，打开最新收到的确认注册邮件，点击链接，完成注册操作，即可登录论坛。

img

登录论坛后，完成个人资料的填写后，即可点击“新增+”，来发布不同类型的帖子。

img