Supabase中关联用户双向好友关系的查询问题

问题背景 #

现有两张表：

users: {
   id, 
   name
}

friends: {
   id,
   requestSentBy: relation(users.id), 
   requestSentTo: relation(users.id)
}

需要查询指定用户时，同时关联该用户作为请求发送者（requestSentBy）和接收者（requestSentTo）的所有friends记录，并合并到一个friends数组中。当前查询仅能获取用户发送的请求，无法覆盖接收的请求场景。

解决方案：同时关联两个外键关系并合并数据 #

Supabase会为同一个表的不同外键关系生成独立的关联字段，我们可以同时查询这两个关系，再在前端将数据合并为一个数组。

步骤1：查询两个关联关系 #

使用别名让字段名更清晰，同时获取发送和接收的请求记录：

const { data, error } = await supabase
  .from('users')
  .select(`
    *,
    sent_requests:friends!friends_requestSentBy_fkey(*),
    received_requests:friends!friends_requestSentTo_fkey(*)
  `)
  .eq('id', user?.id)
  .single();

步骤2：合并数据为friends数组 #

拿到查询结果后，将两个请求数组合并，并清理冗余字段：

if (data && !error) {
  // 合并发送和接收的请求记录
  const combinedFriends = [
    ...(data.sent_requests || []),
    ...(data.received_requests || [])
  ];

  // 构造最终的用户数据结构
  const userProfile = {
    ...data,
    friends: combinedFriends,
    // 移除临时字段
    sent_requests: undefined,
    received_requests: undefined
  };

  // 使用处理后的userProfile
  console.log(userProfile);
} else if (error) {
  console.error('查询出错:', error);
}

替代方案：数据库层面合并（可选） #

如果希望在数据库层面完成合并，可以创建一个视图或RPC函数：

1. 创建视图user_friends，包含用户所有的发送/接收请求记录
2. 在Supabase中为users表和user_friends视图建立关联
3. 查询时直接关联该视图即可

不过前端合并的方式更轻量，适合大多数场景。

内容的提问来源于stack exchange，提问作者Deep Shetye