如何在 iframe 中嵌入 BigBlueButton 3.0

如果您使用的是我們的雲端託管服務，則只需使用您的 API 金鑰即可—無需其他配置。

如果您使用的是其他託管方案，請聯絡我們的支援團隊。我們需要對您的伺服器進行一些設定變更才能啟用 iframe 嵌入。

您還可以註冊一個免費試用帳戶，以便在開發應用程式時測試整合功能。

需要 SSL

您的 <iframe> 必須託管在透過 HTTPS (SSL/TLS) 提供服務的網站上。 WebRTC 功能（例如相機、麥克風和螢幕共用）需要安全的網路環境。如果您的網站未使用 SSL 加密，使用者將無法授予必要的權限。

啟用允許無會話請求

建立會議時，您必須設定 allowRequestsWithoutSession 參數 true.

此參數允許使用者在不進行會話 cookie 驗證的情況下加入會議，而當使用者透過載入在 iframe 中的 API 產生的加入 URL 加入會議時，則需要進行會話 cookie 驗證。

此參數是在 BigBlueButton 2.4.3 中新增的，預設值為 false如果省略此參數或將其留空，則表示為 false使用者可能無法透過嵌入式 iframe 加入會議。

為 iframe 建立加入 URL

使用以下方式建立會議 create API 呼叫和包含 allowRequestsWithoutSession=true.
等待約 5 秒鐘，會議即可初始化，或輪詢 getMeetingInfo API 端點，直到會議可用為止。
會議開始時顯示載入畫面。
使用以下方式產生加入 URL join API調用。
使用產生的加入 URL 作為 src iframe 的屬性。

重要

建立會議後即可立即產生加入 URL，但應等到會議準備好後再顯示 iframe。過早載入 iframe 可能會導致錯誤頁面。

Vue.js、React 和 Angular 各自都有渲染 iframe 的方法。請參考您所用框架的文檔以了解具體實作細節。

正確設定 iframe 權限

这 allow 必須按照以下所示配置屬性，才能啟用相機、麥克風和螢幕共用功能：

<iframe
 src="https://manager.bigbluemeeting.com/bigbluebutton/api/join?..."
 width="100%"
 height="700"
 allow="camera *; microphone *; display-capture *;"
 allowfullscreen
></iframe>

配置正確後，iframe 將自動將使用者加入會議。