该平台采用 AI 驱动的功能（内容生成、主题推荐、分析洞察），并与外部 AI 提供商连接。AI API 使用费用不包含在购买价格中。你需要自行提供 API 密钥并单独管理相关费用。典型费用会根据使用量而有所不同。
专为创业者、初创企业和开发者设计，他们希望快速推出社交社区平台，无需从零开始构建。xBook 完全响应式，移动优先，支持暗/浅主题，并具备企业级安全（50+数据库表的行级安全）。
演示网址： https://xbook.wrapcoders.com
用户： [email protected] / User123！
版主： [email protected] / 版主 123！
管理员： [email protected] / 管理员 123！
xBook — 社交网络 JS 脚本
xBook 是一个功能丰富、面向生产环境的社交网络平台，采用 React 18、TypeScript 5、Vite 5、Tailwind CSS v3 构建，并由 Supabase（PostgreSQL、认证、存储、边缘函数、实时）驱动。它提供完整的 Facebook 类社交体验，包含市场、实时消息、群组、页面、活动、故事、短视频、视频平台和强大的管理面板——全部集中在一个代码库中。
专为创业者、初创企业和开发者设计，他们希望快速推出社交社区平台，无需从零开始构建。xBook 完全响应式，移动优先，支持暗/浅主题，并具备企业级安全（50+数据库表的行级安全）。
演示网址： https://xbook.wrapcoders.com
用户： [email protected] / User123！
版主： [email protected] / 版主 123！
管理员： [email protected] / 管理员 123！
主要亮点
- 150+ React Components — 采用 shadcn/ui 构建的生产质量、可重用 UI（Radix UI）
- 50+ 数据库表 — 完整的 PostgreSQL 模式，带有行级安全策略
- 10 边缘功能 — 无服务器后端逻辑（管理员设置、AI 翻译、欺诈检测、计划任务）
- 10 个存储桶 ——用于整理个人资料、帖子、故事、短片、列表等的媒体存储
- 实时一切 ——消息、通知、在线状态、通过 Supabase Realtime 的输入指示器
- 暗与亮主题 ——系统偏好检测，手动切换
- 全响应式——移动优先设计，配备自适应侧边栏、触控手势、可滑动组件
- 4 步安装向导 ——引导首次运行安装，安全创建超级管理员
- 演示/测试模式 — 通过环境变量切换以快速演示
- 全面文档 ——包含完整的设置、部署、升级和 API 参考指南
认证与安全
- 电子邮件与密码注册 ——7 步入职向导，包含头像裁剪、封面照片、简介、兴趣选择（从 14 个类别中最多选择 8 个）和好友查找功能
- 社交登录 ——Google OAuth 和 Apple 登录集成就绪
- 邮件验证 ——可通过重发按钮和 60 秒冷却计时配置开关
- 密码重置 ——通过邮件链接到专门的 /reset-password 页面进行安全重置流程
- 密码强度指示器 ——注册时实时视觉强度反馈（弱/中/强/非常强）
- 行级安全（RLS）——每一张表都采用细粒度的 PostgreSQL 访问策略保护
- RBAC 角色 — 管理员、版主、用户角色存储在独立的 user_roles 表中，具备安全定义检查功能
- 屏蔽并潜睡用户 — 完整用户屏蔽系统和可配置时长的临时休眠
- 设置向导保护 ——当没有管理员时自动重定向到 /setup;Edge 功能阻挡重复管理员创建
- 演示模式 ——环境标志 VITE_DEMO_MODE 显示认证页面上的快速登录凭证;禁用后完全隐藏
用户档案
- 丰富的个人主页 ——显示姓名、简介、头像、封面照片（带拖拽定位偏移）、地点、网站、教育背景、工作单位、电话、出生日期、兴趣组合
- 头像与封面照片裁剪 ——内置图像裁剪器（react-easy-crop），支持缩放和旋转控制
- 个人资料完成进度条 ——可视化百分比指示器，鼓励用户填写所有个人资料字段
- 5 个个人资料标签页 — 帖子（用户时间线）、关于（包含所有个人信息的介绍卡）、好友（管理层网格）、照片（帖子图库）、签到（地图历史）
- 基于地图的签到 ——互动式传单地图，显示用户签到历史，并带有地理编码集成
- 在线在线状态追踪 ——实时 last_seen_at，绿色（在线）、黄色（离开）、灰色（离线）状态指示
- 可配置性别选项 — 管理员管理的性别选择
- 关系状态 ——可自定义关系显示
- 好友卡 ——资料侧栏快速查看 6 个好友网格
- 照片卡 ——自动生成的用户帖子中提取的图片画廊
帖子与新闻推送
- 丰富帖子创建 ——带有多张图片上传的文本内容（带点指示器的可滑动旋转木马）、视频上传以及仅文本帖子的样式背景选项
- 感受与活动 ——在帖子中附上表情符号，显示情绪/活动状态（例如，“感到快乐”）
- 位置标记 ——在帖子内签到地点
- 隐私控制—— 按帖子隐私：公开（所有人）、仅限好友（共同好友）、仅限我（私人）
- 6 种反应类型 ——比如，爱，哈
哈，哇，悲伤，愤怒，带动画表情符号选择器 - 串评论 ——嵌套回复链，每条评论都有独立反应
- 分享系统 ——将帖子分享到拥有时间线、群组或带有原帖署名的页面
- 保存/收藏文章 ——将文章保存到个人收藏中，可通过专用保存页面访问
- 收藏到个人资料顶部 — 将一篇重要文章置顶到个人资料时间线顶部
- 带完整历史编辑 — 编辑带有完整修订历史跟踪和不同查看模式的帖子
- 帖子排程 ——通过月历视图和每周时间线视图安排未来发布的帖子
- 后嵌 ——通过边缘函数生成可嵌入的 HTML iframe 代码，用于外部网站
- AI 驱动翻译 ——利用 AI 通过边缘功能将任何帖子翻译成任何语言
- 帖子推广 ——利用推广积分系统向更广泛的受众推广帖子
- 评论通知订阅 ——订阅即可接收特定帖子的新评论通知
- 隐藏动态中的帖子 ——隐藏不需要的帖子而不取消好友
- 举报内容 — 将不当帖子连同原因和描述举报至审核队列
- 存档帖子 ——存档旧帖，但不永久删除
- 禁用评论 ——帖子所有者可以根据帖子开关评论
- Image Lightbox — 全屏图像查看器，带有内嵌社交面板（图片旁有反应和评论）
- 多图像轮播 ——可滑动图片库，带 Embla 轮播和点导航功能
- 话题标签自动链接 ——帖子内容中的话题标签会自动链接到发现页面 /hashtag/：tag
- 基于兴趣的订阅源 ——用户可以标记帖子为“感兴趣”或“不感兴趣”，以影响未来的订阅源相关性
故事
- 照片与视频故事 ——上传短暂内容，自动 24 小时有效期
- 全屏查看器——沉浸式故事观赏体验，包含进度条指示器和故事间自动推进
- 故事反应 ——用表情符号和可选的短信回复来回应故事
- 故事亮点 ——将过期的故事保存到永久亮点收藏中，并配有自定义封面图片和标题
- 故事环指示器 ——头像上彩色环形动画，显示未观看的故事
- 50MB 上传限制 — 专用故事-媒体存储桶，支持宽松的文件大小
短视频（短视频）
- 视频上传 — 上传带有说明和自定义缩略图的短视频垂直视频（最大 100MB）
- 点赞与线关评论 ——完整的互动系统，包含嵌套回复线程
- 观看次数追踪 ——每个卷轴上显示的自动观看计数
- 创作者关注系统 ——关注喜欢的内容创作者;显示的粉丝数量
- 分享与保存 ——外部共享卷轴并保存到个人收藏
- 底部评论—— 移动端优化的评论面板从底部滑动向上
- 上传模式 ——简洁的上传界面，支持视频预览、字幕输入和缩略图选择
实时消息传递
- 1：1 直接消息——任意两位用户之间的私人对话
- 群聊 ——多用户组对话，包含管理员/成员角色
- 文件附件 — 发送图片、文档、PDF 及其他文件（最高 10MB），并附有预览
- 语音消息 ——录制并发送语音，支持波形可视化和播放
- 消息反应 ——用任何表情符号回应单个消息
- 已读回执 ——准确查看接收者何时阅读消息
- 打字指示器 ——实时“打字......”其他用户写作时显示状态
- 置顶消息 ——将重要消息置顶到对话顶部，便于查找
- 编辑与删除消息 — 编辑已发送消息（显示“已编辑”指示）;删除消息
- 转发消息 ——将任何消息转发到其他对话
- GIF 选择器 — 通过 Tenor API 代理搜索并发送动画 GIF（边缘函数处理 CORS）
- 完整表情符号选择器 — 带有搜索功能的分类表情符号键盘
- 群聊设置 — 重命名群组、更改群头像、添加/移除成员、分配管理员角色
- 实时传递 ——通过 Supabase 实时 PostgreSQL 订阅，消息无需页面刷新即可即时显示
- 未读计数徽章 ——导航中未读消息的视觉指示
团体
- 公共与私密群组 — 公共群组（任何人可立即加入）或私密群组（需管理员批准）
- 10 个类别 ——综合、科技、游戏、音乐、体育、教育、商业、娱乐、科学、艺术
- 群发帖 ——支持置顶的群组内完整创建帖子（管理员可以置顶重要帖子）
- 自动创建的群组对话 ——每个组通过数据库触发器自动获得关联的消息对话
- 组活动 — 创建和管理针对特定组的活动，具备完整的 RSVP 功能
- 角色管理—— 三级角色：管理员（完全控制）、版主（内容管理）、成员（标准访问）
- 可分享邀请链接 ——生成可配置的有效期和最大使用限制的邀请码
- 群组通知偏好设置 ——静音整个群组，或选择性切换帖子、评论和活动的通知
- 组别分析仪表盘 ——会员增长图表、帖子互动指标、活动统计
- 活动订阅源 ——所有小组活动的时间线（新成员、帖子、事件）
- 组规则 ——管理员可编辑的规则/指南部分向所有成员展示
- 悬浮卡 ——快速预览弹窗，显示群组信息、成员数量和悬停时加入按钮
- 封面照片与头像 ——可定制的群体品牌，图片上传到群组图片桶
- 会员管理 — 批准/拒绝加入请求（私密组），移除成员，晋升/降级角色
- 团体推荐 ——根据类别发现推荐团体
- 帖子 分享 Modal — 在外部或其他对话中分享群组帖子
页面
- 商业与组织页面 — 专门页面，带有自定义 slug 网址，访问地址为 /page/：slug
- 多页面分类 ——商业、娱乐、教育、社区、科技、健康、艺术、体育、美食、其他
- 页面帖子 — 创建内容作为页面身份，并可选择未来发布的时间安排
- 关注者系统 ——用户关注主页以查看主动态内容
- 多管理员支持 — 增加多名管理员以协作管理单一页面
- 页面活动——创建和管理页面品牌下的活动
- 分析仪表盘 ——粉丝增长、帖子覆盖率、参与度指标及趋势图表
- 联系方式 — 显示电子邮件、电话、网站网址及实际位置
- 关于部分—— 详细页面描述和信息
- 悬浮卡 ——页面名称上的快速预览弹窗，悬停显示关键细节
- 预定发布—— 日历视图和每周时间线，用于管理预定页面内容
- 页面推荐 ——根据类别和兴趣发现推荐页面
活动
- 10 个类别 ——社会、商业、教育、娱乐、体育、科技、健康与养生、艺术与文化、社区、其他
- RSVP 系统 ——三种回复选项：去、感兴趣、不去，并附有完整参与者名单模式，显示出席者
- 重复性支持 ——无，支持每日、每周、每月、每年，并可配置重复结束日期和父子事件关联
- 可配置提醒 ——将提醒设置在活动前 15 分钟、30 分钟、1 小时、2 小时、1 天或 1 周;通过边函数实现
- 日历视图 ——月度日历网格，带有彩色点点表示每天的事件;点击筛选
- 地图视图 ——带标记聚类的互动传单地图，显示事件地理位置
- 串评论 ——关于活动的完整讨论系统，带有嵌套回复帖
- 相关活动 — 通过匹配类别发现类似活动
- .ics 日历导出 — 一键导出至谷歌日历、苹果日历、Outlook 及其他日历应用
- 分享 Modal — 通过可复制链接或社交平台分享活动
- 封面图片 ——用于视觉活动品牌的定制封面照片
- 每周邮件摘要 ——通过边缘功能自动每周总结即将发布的活动
- “本周”侧边栏小部件 ——右侧边栏快速查看本周活动
- 活动编辑 ——完整编辑功能，包含日期、地点、描述和封面照片更新
市场
- 产品列表——创建包含标题、丰富描述、价格、多张图片上传、类别、品相和位置的列表
- 10 个类别 ——电子产品、车辆、时尚与配饰、家居与园艺、体育与户外、玩具与游戏、图书与媒体、音乐与乐器、服务、综合
- 4 个条件 ——新旧、二手——喜欢新、二手——良好、二手——普通
- 挂牌状态 — 活跃、已售、已预订，带颜色编码的视觉指示
- 报价系统 ——买家发送带有可选信息的金钱报价;卖家可以接受、拒绝或还价
- 卖家仪表盘 ——通过 Recharts 构建的综合分析，展示独特视图、总存档、活跃报价、已接受收入、转化率、节省率和 7 天趋势图
- 卖家评价与星级评分 ——五星评分系统，附有文字评论;计算并显示的平均评分
- 验证卖家徽章 ——通过边缘功能自动授予符合验证标准的卖家信托徽章
- 自动欺诈检测 ——由人工智能驱动的欺诈信号检测，通过专用边缘功能分析价格异常、可疑模式和列表元数据
- 欺诈警告横幅 ——在有活跃未解决欺诈信号的房源上显示视觉警告横幅
- 价格历史图表 ——通过折线图跟踪和可视化价格随时间的变化;通过数据库触发器的自动日志
- 列表模板 ——将常用列表配置（标题、描述、分类、状态、地点）保存为可重复使用的模板
- 保存/收藏列表 ——将有趣的列表保存到已保存页面的专用“列表”标签页
- 最近浏览 — 使用 localStorage 自动跟踪和显示最近浏览的列表
- 查看计数器 — 用 viewer_id 跟踪独家列表视图以进行分析
- 推广列表 ——通过基于信用的推广系统提升列表可见度，并按类别和地点定向
- 房源报告——举报可疑或违反政策的房源;举报会进入管理员管理队列
- 推荐与热门列表 ——发现相似商品和热门商品
- 私信集成 ——通过预先填写的包含商品标题和价格的消息联系卖家
- 分享列表 ——通过可复制链接分享，或以文本预览卡形式发布到活动信息流
- 批量操作 ——通过卖家仪表盘界面同时管理多个列表
观看（视频平台）
- 视频上传 ——上传分为 13 个内容类别的长视频
- 播放列表 ——创建和管理公开或私密视频播放列表
- 直播指示器 — 直播内容的视觉“直播”徽章覆盖
- 点赞与线关评论 ——完整的互动，包含嵌套评论回复
- 保存与分享 ——收藏视频并外部分享
- 观看跟踪 ——自动观看次数跟踪
- 基于类别的推荐 ——按内容类别发现相关视频
- 视频卡 ——带有时长叠加、观看次数和频道信息的缩略图预览卡
- 播放列表面板 ——侧面板显示播放列表视频，当前位置被高亮
通知
- 实时应用内通知 ——即时传递，头部显示动画未读计数徽章
- 11+ 通知类型 — 好友请求、点赞、评论、分享、群组邀请、群组加入请求、活动提醒、消息、提及、创作者关注、页面关注
- 网页推送通知 ——基于浏览器权限的原生推送通知
- 声音提醒 ——可按用户偏好切换音频通知音效
- 可滑动关闭 ——移动通知项上的滑动以拒绝手势
- “On This Day” Memories —— 每日回忆卡片，显示过去几年该日期的帖子，由边缘功能驱动
- 标记为已读 ——单独和批量的“标记为已读”功能
- 通知偏好—— 针对接收通知的细致类型控制
- 下拉菜单与全页 — 从头部快速访问，加上完整通知页面，访问 /通知
全球搜索
- 统一搜索栏 ——单一搜索输入，可同时跨用户、帖子、群组、页面、活动、市场列表和话题标签搜索
- 分类标签结果 ——按内容类型组织结果，支持切换标签页
- 实时搜索 ——你在输入时即时获得去跳出的查询结果
- Hashtag Discovery — 专门的话题聚合页面，位于 /hashtag/：tag
- 键盘快捷键 — Ctrl+K / Cmd+K 可瞬间聚焦搜索栏
管理面板（完整后台管理）
- 管理仪表盘 ——包含关键平台指标和实时在线用户跟踪概览
- 用户管理 ——搜索并筛选所有用户;查看详细资料;分配角色（管理员、版主）;发出警告并说明原因;应用临时封禁（可配置时长）或永久封禁
- 11个设定类别：
- 通用 ——维护模式切换，SEO 友好 URL，平台范围切换
- 用户 — 用户注册开启/关闭，默认用户角色，配置文件字段设置
- 登录与安全 ——双因素认证、暴力破解保护、会话超时配置
- 网站信息 — 网站名称、元描述、基础网址、联系邮箱
- API 密钥 ——管理第三方 API 密钥（Google 地图、reCAPTCHA 等）
- 文件与存储 — 存储后端选择（Amazon S3、DigitalOcean Spaces、Wasabi、FTP、Google Cloud Storage、Backblaze B2）、FFMPEG 媒体处理切换
- 电子邮件与短信 ——SMTP 服务器配置、短信网关设置、OneSignal 推送通知集成、可定制 HTML 邮件模板
- AI 设置 ——OpenAI 与复制 API 集成，基于信用的 AI 功能变现并实现用户配额
- 功能 — 可单独开关平台功能（故事、短视频、市场、手表、活动、群组、页面）
- 支付 — 多支付网关配置（Stripe、PayPal、Razorpay 等）、专业订阅套餐、数字钱包限制
- 移动应用 — 移动应用配置、应用商店下载链接、深度链接设置
- 网站设计 ——上传分别为浅色/暗色主题创建标志，设置主主题颜色，注入自定义全局 CSS 和 JavaScript 代码
- CMS 编辑器 — 富文本所见（WYSIWYG）编辑器，用于创建静态内容页面（服务条款、隐私政策、常见问题等），支持基于 slug 的 URL 和发布/取消发布开关
- 内容审核队列 — 通过状态工作流程（待处理→批准/拒绝）和审核员笔记审核所有被举报的内容
- 用户警告与封禁 ——分层执行：书面警告、具特定期限的临时封禁、有明确理由的永久封禁
- 版主活动日志 ——对每个版主操作的完整审计记录，包含时间戳、版主 ID、行动类型和详细信息
- 广告管理 ——创建和管理带有人口统计目标（年龄范围、性别、地点、兴趣类别）的赞助帖子，设定频率上限，监控展示/点击/点击率分析的绩效仪表盘
- 验证请求 ——处理用户身份验证和卖家验证请求
- 组管理 — 所有平台组的管理员概述和管理
- 页面管理 ——所有平台页面的管理员概述和管理
- 活动管理 ——所有平台事件的管理员概述和管理
- 列表管理 — 管理所有市场列表的管理
- 性别配置 — 管理用户档案的可用性别选项
- 视频与音频设置 ——配置媒体处理选项和画质设置
- 推送通知管理 ——服务器端推送通知配置与发送
- 电子邮件模板管理 ——定制自动通知邮件模板
广告与变现系统
- 赞助帖子 ——用户创建推广内容，按年龄范围、性别、地理位置和兴趣类别进行定向
- 频率上限 ——可配置用户看到同一广告的频率限制
- 绩效仪表盘 ——详细分析，通过可视化 Recharts 图表跟踪展示量、点击率、点击率（CTR）
- 横幅横幅广告 ——横幅广告遍布平台信息流
- 插页广告 ——全屏广告以可配置的时间间隔显示
- 推广积分经济 ——用于提升帖子和市场列表的虚拟积分系统
- 信用交易 — 完整的交易历史， 并跟踪信用赚取/支出
- 广告绩效分析 ——为广告主提供包含投资回报率指标的全面报告
数据库架构（50+表，带行级安全）
按域组织的完整 PostgreSQL 模式：- 核心： 个人资料、user_roles、友谊、帖子、post_likes、评论、comment_likes、对话、消息、消息、message_reactions、message_read_receipts、通知、site_settings、blocked_users、snoozed_users
- 社交： 群组、group_members、group_posts、group_post_likes、group_post_comments、group_invites、group_notification_preferences、页面、page_admins、page_followers、page_posts、page_post_likes、page_post_comments、group_events、group_event_rsvps、event_comments、event_reminder_preferences、卷轴、reel_likes、reel_comments、creator_follows
- 市场： 房源、listing_offers、listing_views、listing_price_history、listing_templates、listing_reports、listing_fraud_signals、saved_listings、seller_reviews、promoted_listings、promotion_credits、credit_transactions
- 系统：content_reports、moderation_log、cms_pages、hidden_posts、saved_posts、post_edit_history、post_interests、post_notification_subscriptions、sponsored_posts、conversation_members
设计系统
- 主色：Teal（#247b7b）配备完整的 HSL 令牌系统
- 字体设计：Geist Sans + Geist Mono 字体家族
- 暗色模式与光明模式： 完整的双主题，带系统偏好检测
- 语义设计代币：CSS 自定义属性，实现 150+ 组件间的主题一致性
- shadcn/UI 组件：50+ Radix UI 原件（对话框、下拉菜单、弹出、标签页、吐槽等）
- 响应式断点： 移动优先，优化平板和桌面
- Lucide 反应图标： 整个平台的图标系统保持一致
