指南

了解如何设置、自定义并充分利用Social Stream Ninja

聊天来源 YouTube、Twitch、TikTok及另外100多个平台
Social Stream Ninja 扩展或桌面应用将所有聊天合并到一个会话中
停靠面板 审核、展示和回复
OBS叠加层 在直播中展示精选聊天和提醒

一个会话ID连接所有部分:请使用相同的 ?session= 值,用于停靠面板和叠加层URL。

查找指南

搜索或打开一个类别。如果只是想在屏幕上显示聊天,请从OBS开始。

从这里开始 安装、连接聊天、添加OBS叠加层
管理直播停靠面板操作、内容审核、中继和参与互动
叠加层与自定义 模板、样式选项、字体和事件
自动化与集成 API、命令、Event Flow、Webhook
AI与文字转语音 语音搭档、浏览器助手、机器人、本地模型、文字转语音
平台指南 TikTok、YouTube、Twitch、Kick、支持的网站
故障排除与支持 聊天缺失、叠加层空白及深入支持文档

未找到匹配的指南。

详细指南章节 完整的分步指南正文。如果只需要目录,可将其折叠。

入门(浏览器扩展)

1. 安装

使用Social Stream Ninja前需要先安装。浏览器扩展有多种安装方式:

  • 手动安装(推荐): 要使用最新版本,请在开发者模式中手动安装。
  • Chrome网上应用店: 通过Chrome网上应用店安装,设置最为简单。

详细安装说明请访问 下载页面.

2. 基本设置

安装后,请按以下步骤开始使用Social Stream Ninja:

  1. 在浏览器中打开直播平台的聊天(如果支持,也可使用弹出聊天功能)
  2. 点击浏览器工具栏中的Social Stream Ninja扩展图标
  3. 点击“Enable Extension”启用扩展(图标应变为绿色)
  4. 打开扩展弹出菜单提供的“Dashboard Link”
  5. 在OBS中将“Overlay Link”作为浏览器源打开

注意: 为获得最佳体验,使用浏览器扩展时,请让聊天窗口保持可见,不要最小化。

3. 连接不同平台

Social Stream Ninja支持100多个平台。以下是连接常用平台的方法:

YouTube

  • 打开YouTube直播聊天
  • 点击右上角的“Pop out chat”按钮
  • 确保Social Stream Ninja扩展已启用(绿色图标)

Twitch

  • 打开您频道的Twitch聊天
  • 点击齿轮图标并选择“Pop out chat”
  • 确保Social Stream Ninja扩展已启用(绿色图标)

Facebook

  • 打开您的Facebook直播(以观众或发布者身份)
  • 确保使用Wi-Fi或以太网连接,而不是移动数据
  • 确保Social Stream Ninja扩展已启用(绿色图标)

Discord、Slack、WhatsApp等。

  • 首先,在扩展设置中启用这些平台(切换开关)
  • 在浏览器中打开这些平台的网页版
  • 确保Social Stream Ninja扩展已启用(绿色图标)

自定义(浏览器扩展)

URL参数

通过在URL中添加参数,可以自定义仪表板和叠加层。例如:

仪表板参数:

&darkmode - 为仪表板启用深色模式
&scale=2 - 将所有元素的大小和分辨率加倍
&hidesource - 隐藏平台图标(YouTube、Twitch等)
&compact - 去掉姓名和消息之间的间距
&inline - 将消息排在姓名旁边,同时保留正常间距
&autoshow - 自动展示新到的消息(约每3秒2条)

叠加层参数:

&showtime=20000 - 20秒后自动隐藏所选消息
&showsource - 在用户名旁显示平台图标
&fade - 让精选消息淡入,而不是突然出现
&swipe - 让精选消息从左侧滑入
¢er - 将精选消息放在屏幕中央

要更轻松地管理URL,请试用我们的 URL参数编辑工具.

CSS自定义

有多种方式可以使用CSS自定义外观:

方法1:OBS浏览器源CSS

在OBS中,可以为浏览器源添加自定义CSS:

  1. 将叠加层作为浏览器源添加到OBS
  2. 勾选“Custom CSS”选项
  3. 在文本框中输入自定义CSS
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }

:root {
    --comment-color: #090;
    --comment-bg-color: #DDD;
    --comment-border-radius: 10px;
    --comment-font-size: 30px;
    --author-border-radius: 10px;
    --author-bg-color: #FF0000;
    --author-avatar-border-color: #FF0000;
    --author-font-size: 32px;
    --author-color: blue;
    --font-family: "Arial", sans-serif;
}

.hl-name {
    padding: 2px 10px !important;
}

方法2:扩展菜单设置

通过扩展菜单直接添加CSS:

  1. 点击Social Stream Ninja扩展图标
  2. 找到CSS/JavaScript设置部分
  3. 输入自定义CSS或JavaScript
  4. CSS将作为base64编码的数据附加到URL

方法3:使用自定义模板

选择内置CSS样式的模板:

  • 浏览我们的 模板库
  • 选择符合直播风格的模板
  • 替换 YOURSESSIONID ,将模板URL中的该值替换为您的会话ID
  • 将模板URL作为浏览器源添加到OBS

示例: https://socialstream.ninja/themes/pretty.html?session=YOURSESSIONID

为聊天姓名设置不同颜色

姓名颜色需要两项设置:首先,在以下位置设置通用颜色来源: 消息 - 样式(Message - Styling) 以及以下位置的停靠面板显示开关: 消息 - 可见性(Message - Visibility).

打开聊天姓名颜色指南 ,其中包含截图、颜色选择、故障排除和CSS示例。

自托管字体与样式

将自己的字体用于 dock.html 或 featured.html 而无需依赖Google或系统字体。

  • 托管您的.woff2/.ttf/.otf文件,并通过以下方式加载: @font-face.
  • 通过OBS的自定义CSS或以下URL参数应用CSS: &css=, &b64css=, &font=,或 &googlefont=.
  • 在Chrome扩展、Electron应用和托管页面中的工作方式相同。

打开自托管字体指南 ,其中包含分步托管说明和CSS示例。

高级功能(浏览器扩展)

文字转语音

Social Stream Ninja可以使用文字转语音技术朗读聊天消息:

设置文字转语音:

  1. 添加 &speech=en-US 到featured.html或dock.html的URL
  2. 对于其他语言,请选择支持该语言的提供商和音色。例如,葡萄牙语可使用Piper &pipervoice=pt_BR-faber-medium 或eSpeak &espeakvoice=pt-br,而西班牙语可以使用Piper &pipervoice=es_ES-davefx-medium 或eSpeak &espeakvoice=es.
  3. 使用以下参数自定义语音设置: &pitch=1&volume=1&rate=1

免费的本地文字转语音选项(无需API密钥):

  • Kokoro TTS: 浏览器内置AI,效果出色 — &ttsprovider=kokoro
  • Piper TTS: 快速、轻量的神经网络文字转语音 — &ttsprovider=piper
  • eSpeak-NG: 轻量级的语言备用方案,包括葡萄牙语 &espeakvoice=pt-br 以及西班牙语 &espeakvoice=es
  • Kitten TTS: 占用最小,仅需CPU — &ttsprovider=kitten
  • 自托管服务器: 通过Docker在本地运行Kokoro-FastAPI或openedai-speech — &ttsprovider=openai&openaiendpoint=http://localhost:8880/v1/audio/speech

优质云端文字转语音选项:

  • Google Cloud TTS: 专业级音色(需要Google API密钥)
  • ElevenLabs: 超逼真音色,支持自定义声音训练
  • Speechify: 自然的优质音色

希望在本地运行并保护隐私? 请参阅 本地 AI TTS 指南 ,其中包含完整设置说明,包括自托管服务器选项和OBS音频捕获。

AI搭档、聊天机器人和浏览器助手

Social Stream Ninja可以用多种方式使用AI。请先选择工作流程,再选择提供商。

  • 语音搭档: 通过麦克风交谈,同时让实时聊天提问进入同一个搭档会话。
  • ChatGPT浏览器助手: 捕获聊天,或通过实验性功能将聊天转发到已打开的 chatgpt.com 标签页,无需API密钥。
  • 主聊天机器人: 在叠加层中、通过文字转语音或在支持的聊天中回复选中的观众。
  • 处理工具: 内容审核、翻译、摘要、RAG知识搜索和AI构建的叠加层。

选择AI设置

消息排队与置顶

安排消息在叠加层中的显示方式:

消息排队:

  1. 按住CTRL(Mac上为Cmd)并点击仪表板中的消息
  2. 点击“Next in Queue”按钮,逐条显示消息
  3. 消息将按入队顺序出现在叠加层中

置顶消息:

  1. 按住ALT并点击仪表板中的消息
  2. 消息将保持置顶在仪表板顶部
  3. 要取消置顶,请按住ALT并再次点击已置顶消息

直播事件捕获

从直播平台捕获新关注、订阅、突袭和打赏等非聊天事件。

启用方法:

  1. 点击Social Stream Ninja扩展图标
  2. 找到 “捕获直播事件”(Capture Stream Events) 设置中的开关
  3. 启用后即可开始接收提醒

注意: 打赏类事件(Super Chat、Bits、打赏)会自动转发,不受此开关影响。此开关主要控制关注和订阅提醒。

各平台可捕获的事件:

YouTube

  • 新会员和赠送会员
  • 会员升级和里程碑
  • Super Chat和Super Sticker打赏
  • 订阅人数和观众人数

Twitch

  • 新订阅、续订和赠送订阅
  • 关注者和关注人数
  • Bits/Cheer和频道积分兑换
  • 突袭及观众人数

TikTok、Kick及其他平台

  • 关注者和礼物(TikTok)
  • 订阅和打赏(Kick)
  • 大多数平台的观众人数

有关完整的事件负载和数据字段列表,请参阅 事件参考 文档。

Hype Train顶部栏

在OBS中以Twitch风格的顶部栏显示Hype Train和Treasure Train的进度。

  • 从弹出菜单复制专用的Hype Train Top Bar链接。
  • 正式直播前,使用Fake Hype Train按钮进行测试。
  • 请参阅指南中的设置步骤、截图和故障排除。

打开Hype Train顶部栏指南

首次发言者

突出显示首次发言者,添加可选的叶子徽章,或只在首次发言时播放停靠面板提示音。

  • 保持本地消息数据库启用。
  • 开启首次发言者检测。
  • 选择适合叠加层的高亮、徽章和提示音选项。

打开首次发言者指南

Event Flow 编辑器

Event Flow编辑器是强大的节点式自动化系统,可用于创建自定义工作流程。它提供高级自动化功能,让您编写自己的路由逻辑。

可以做什么:

  • 在平台之间转发聊天 通过智能筛选(例如将Twitch转发到Discord,但屏蔽命令)
  • 创建自定义命令 通过AND/OR/NOT逻辑门
  • 触发叠加层和音频 根据指定事件或关键词
  • 控制OBS 自动控制场景和来源
  • 创建抽奖和赠奖活动 并管理队列

入门:

  1. 从主仪表板菜单打开Event Flow编辑器
  2. 创建新流程并添加来源节点(如“Twitch Message”)
  3. 连接逻辑节点以筛选消息(Contains Keyword、User Role等)
  4. 添加响应的动作节点(Send Chat、Play Audio、Display Overlay)
  5. 正式直播前,使用内置模拟器进行测试

Flow Actions叠加层:

要让音频、媒体叠加层和OBS动作生效,需要将Flow Actions页面作为浏览器源添加到OBS:

  1. 在弹出菜单中找到“Flow Actions”部分并复制URL
  2. 在OBS中将其添加为浏览器源(建议1920×1080)
  3. 保持叠加层打开(可以隐藏,但不要关闭)

重要: 当前的Relay Chat动作会自动跳过识别出的回流消息。请使用 回流过滤器(Reflection Filter) 节点来控制捕获的回流消息是否出现在停靠面板和叠加层中。请参阅 聊天中继教程 以完成设置。详细文档请参阅 Event Flow 指南。Kick奖励的音效或媒体请使用 Kick频道积分/奖励指南.

MIDI 与快捷键控制

通过Stream Deck、MIDI控制器或键盘快捷键直接控制Social Stream Ninja。

设置MIDI:

  1. 连接MIDI设备(Stream Deck、MIDI控制器等)
  2. 打开Social Stream Ninja弹出菜单
  3. 找到MIDI设置部分
  4. 从下拉菜单中选择MIDI设备
  5. 将MIDI音符映射到指定动作

可用动作:

  • 触发自定义叠加层和媒体
  • 发送预设聊天消息
  • 切换OBS场景
  • 播放音频片段或文字转语音
  • 执行Event Flow触发器

提示: MIDI非常适合免手操作直播。您可以用脚踏开关触发提醒,或用旋钮调节音量。

机器人命令与自动回复

为聊天创建交互式机器人命令和自动回复。

内置命令:

  • !joke - 发送一条随机的极客冷笑话
  • !hi - 自动问候观众
  • !cycle - 允许观众切换OBS场景(需要权限)

设置自动回复:

  1. 打开扩展弹出菜单并找到Bot/Auto-Response部分
  2. 启用需要的命令
  3. 保持聊天窗口可见,不要最小化,才能让回复生效
  4. 确保已登录平台并具有发言权限

创建自定义命令:

对于更复杂的命令,请使用Event Flow编辑器:

  1. 创建一个使用Message来源的新流程
  2. 添加“Contains Keyword”节点来检测命令(如“!social”)
  3. 连接一个“Send Chat”动作并填写回复
  4. 可添加User Role筛选器,将命令限制为仅版主可用

要求: 自动回复在Chromium浏览器中效果最佳。聊天窗口必须保持可见,并且您必须具有在该平台发言的权限。

Webhook与集成

连接外部打赏平台,在直播叠加层中显示打赏和购买。

前提条件:

  1. 记下扩展弹出菜单中的会话ID
  2. 保持Social Stream Ninja启用
  3. 位于 Global settings and tools → Mechanics,启用 扩展的远程 API 控制
  4. 使用正常生成的停靠面板和叠加层链接;不要添加 &server, &server2,或 &server3 用于打赏Webhook
  5. 如果停靠面板已经打开,请重新加载一次
只需启用一个API开关: 远程API控制允许后台脚本标准化打赏Webhook,并像普通消息一样传递。其他API传输开关可以保持关闭。

标准化后的打赏会共享给聊天、提醒、Event Flow,以及打赏罐/目标进度条。

启用远程API控制,同时保持其他API传输开关关闭

支持的平台:

平台 Webhook URL 事件类型
Stripe https://io.socialstream.ninja/{sessionID}/stripe checkout.session.completed
Ko-Fi https://io.socialstream.ninja/{sessionID}/kofi 公开打赏、会员、商店订单和委托
Buy Me A Coffee https://io.socialstream.ninja/{sessionID}/bmac 打赏、会员、商店订单、委托和愿望清单筹款
Fourthwall https://io.socialstream.ninja/{sessionID}/fourthwall 订单、礼物、打赏和新订阅

Stripe设置:

  1. 创建一个 Stripe付款链接
  2. 重要: 为付款链接添加自定义字段:
    • 显示名称 或 用户名 (必填)- 缺少此字段会拒绝打赏
    • 消息 (可选)- 允许打赏者留言
  3. 前往 Stripe Webhooks 并创建新的端点
  4. 将URL设置为: https://io.socialstream.ninja/YOUR_SESSION_ID/stripe
  5. 选择事件: checkout.session.completed
  6. 无需签名验证(请改为保密会话ID)

测试: 使用Stripe测试模式,卡号为 4242 4242 4242 4242、任意未来到期日期和任意CVC。

创作者商店设置

使用 图文设置指南 适用于Fourthwall、Ko-fi和Buy Me a Coffee,包括接收状态、独立预览和商品导入。

安全提示: 请勿公开会话ID。任何拥有该ID的人都可以向您的叠加层发送虚假的打赏事件。

通过Webhook导出聊天:

您也可以将聊天数据导出到外部服务:

  • 在设置中配置出站Webhook URL
  • 聊天消息以包含JSON负载的POST请求发送
  • 使用此功能记录聊天、触发外部自动化或与其他工具同步

故障排除(浏览器扩展)

浏览器扩展常见问题的解决方法

窗口最小化问题

后台或最小化时聊天停止

浏览器窗口处于后台或最小化时,聊天消息不再出现。这是因为浏览器会限制后台标签页以节省资源。

禁用浏览器限速
  • Chrome/Edge/Brave:
    1. 打开 chrome://flags/#enable-throttle-display-none-and-visibility-hidden-cross-origin-iframes
    2. 设置为“Disabled”
    3. 同时禁用 chrome://flags/#calculate-native-win-occlusion
    4. 重新启动浏览器
  • 禁用性能限制:
    1. 前往 chrome://settings/performance
    2. 禁用“Throttle Javascript timers in background”
其他方法
  • 保持窗口可见: 调整窗口位置,避免最小化;即使只露出一小部分,也可能防止浏览器限速。
  • 使用虚拟桌面: 在Windows中,使用Win+Tab创建两个虚拟桌面,一个放聊天窗口,另一个放OBS。
  • 尝试独立应用: Social Stream Ninja桌面应用可避免许多浏览器限速问题。
调试栏问题

出现蓝色栏/自动回复不起作用

使用机器人命令或自动回复时,出现蓝色调试栏,或自动回复不起作用。

检查聊天窗口是否可见
  • 使用YouTube或Twitch时,请确保弹出聊天窗口保持打开且可见
  • 某些平台可能需要同时保持主窗口和弹出窗口打开
浏览器兼容性
  • 自动回复在Chromium浏览器(Chrome、Edge、Brave)中效果最佳
  • Firefox对扩展功能的支持有限

常见问题解答

Social Stream Ninja支持100多个平台,包括YouTube、Twitch、Facebook、Instagram、TikTok、Discord、Zoom、Google Meet、X(Twitter)、WhatsApp、Telegram等。完整列表请参阅 支持的平台 页面。
建议大多数用户使用独立应用,因为它:
  • 避免浏览器限速问题
  • 提供自动更新
  • 提供窗口置顶和透明度功能
  • 性能和稳定性更好
如果您有以下需求,浏览器扩展更合适:
  • 需要在多台电脑上使用
  • 不想安装额外软件
  • 希望立即获取最新更新(手动安装)
不需要!Social Stream Ninja的一大优势是大多数平台无需API密钥或登录凭据。它直接从浏览器窗口或应用界面捕获聊天数据。不过,您仍需登录各个平台,才能正常查看聊天。
浏览器扩展: 要更新手动安装的扩展,请下载最新版本,用新文件替换旧文件,然后重新加载扩展或重新启动浏览器。 不要卸载 扩展,以便保留设置。如果使用Chrome网上应用店版本,它会自动更新,但频率较低。 独立应用: 应用会在重新启动时自动更新。您也可以从应用菜单手动检查更新。
可以!Social Stream Ninja在大多数平台上支持双向聊天。当您登录平台且拥有适当权限时,可以从仪表板或通过API命令发送消息,这些消息会同时出现在所有已连接的聊天中。
当然可以!Social Stream Ninja专为OBS Studio及其他直播软件设计。只需将叠加层URL作为浏览器源添加到直播软件中。您可以在OBS中直接使用CSS,或通过URL参数自定义外观。
是的,Social Stream Ninja完全免费,并以GPLv3.0许可证开源。没有订阅、隐藏费用或功能限制。项目由Steve Seguin维护,社区共同贡献。
我们在以下文档中维护所有事件负载的规范列表,包括关注者、会员、突袭、观众人数、打赏等: 事件参考。其中还说明哪些来源需要开启“Capture Stream Events”、登录权限或额外的权限范围才能接收数据。
所有叠加层URL、停靠面板API、WebSocket命令和自动化接口均记录于 命令与 API 页面。若要编写自定义行为,或将Social Stream Ninja与其他工具集成,这是最佳起点。
Social Stream Ninja在Discord上有活跃的社区,您可以直接获得开发者和其他用户的帮助。加入地址: discord.socialstream.ninja。您也可以在此报告问题: GitHub仓库.

仍需帮助?

加入我们的社区Discord服务器,开发者和其他用户可以帮助您排查问题。