如何使用Reveal.js Seminar插件添加演示参会者？

核心问题 #

基于Reveal.js的Seminar插件开发Notion演示应用，已成功以主机身份启动服务器、创建/加入房间，但不清楚参会者的加入方式（包括访问URL、前端实现逻辑），同时疑惑官方未提供默认参会登录页面。

关键结论与实现步骤 #

1. 参会者必须通过搭载Reveal.js+Seminar插件的页面加入 #

Seminar插件依赖Reveal.js的前端环境实现演示同步，因此必须为参会者提供包含相同插件配置的前端页面，无法通过纯服务器端接口直接加入。

2. 参会者页面的配置与加入逻辑 #

• 页面配置：参会者页面的Reveal初始化配置需和主机端完全一致，包括seminar.server、seminar.room、seminar.hash三个核心参数，确保连接到同一个服务器和房间。
• 加入方式：
  • 开启autoJoin: true：插件会自动弹出用户名输入框，参会者输入用户名后即可自动加入房间，无需额外代码。
  • 手动调用方法：关闭autoJoin后，可通过自定义输入框收集用户名，再调用RevealSeminar.join_room(参会者用户名)完成加入。

3. 参会者的访问URL #

参会者访问的URL就是你搭建的前端页面地址，比如主机演示页面部署在http://你的公网IP:端口/presentation，参会者直接访问该地址即可。注意：seminar.server必须设置为外部可访问的公网IP（不能用localhost），否则参会者无法连接到服务器。

4. 官方无默认登录页面的原因 #

Seminar插件是Reveal.js的功能扩展，核心定位是实现演示内容的同步，而非提供完整的参会页面解决方案。开发者需要根据自身应用场景（比如你的Notion演示应用），自定义参会入口页面的样式和交互逻辑。

参会者端代码示例 #

const plugins = [
    RevealHighlight,
    RevealSeminar,
]

Reveal.initialize({
    plugins: plugins,
    controls: true,
    seminar: {
        server: "https://你的服务器公网IP:端口", // 与主机端一致
        room: "你的房间名称", // 与主机端一致
        hash: "服务器生成的密码哈希值", // 与主机端一致
        autoJoin: true // 自动弹出用户名输入框
    }
});

// 若需手动控制加入逻辑，可参考以下代码：
// const joinBtn = document.getElementById('join-room-btn');
// const usernameInput = document.getElementById('username');
// joinBtn.addEventListener('click', () => {
//   const username = usernameInput.value.trim();
//   if(username) {
//     RevealSeminar.join_room(username);
//   }
// });

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