Chime SDK 使用 Vue JS 顯示所有視訊圖塊和即時與會者清單顯示

Question

我在分享視訊會議時多次聽說過本地圖塊和遠端圖塊。我正在嘗試顯示所有與會者視訊圖塊，但在使用 Vue JS 從頭開始製作應用程式時面臨困難，因為我剛開始使用 AWS Chime SDK。我有以下幾個問題。

本地圖塊(getAllVideoTiles)和遠端圖塊(getAllRemoteVideoTiles)有什麼不同？

如何顯示所有與會者的視訊圖塊及其姓名？

如何加上與會者的姓名？我應該在哪裡傳遞它？ createAttendee 還是 createMeeting API？

如何辨識主機？

如何新增會議中的即時聊天和已連接的與會者清單？

React 函式庫可用。 Javascript 演示也是大量的程式碼，我認為對於新手來說理解起來幫助不大。 Vue JS 及其 Demo 有機會嗎？

您的回答對於不久的將來的任何新開發人員都會非常有幫助和值得讚賞。非常感謝。

目前，我有一個觀察者，只顯示我自己和一個與會者圖塊。

videoTileDidUpdate: tileState => {
   const audioElement = this.$refs.audioElement;
   const isDefaultVideo = tileState.tileId === 1;
   this.audioVideo.bindAudioElement(audioElement);
   this.audioVideo.bindVideoElement(
       tileState.tileId,
       isDefaultVideo ? this.$refs.defaultVideoElement : this.$refs.attendeeVideoElement
   );
}

<audio ref="audioElement"></audio>
<video ref="defaultVideoElement"></video>
<video ref="attendeeVideoElement"></video>

Answer 1

我在閱讀 aws-sdk 文件並完成它時所理解的內容，我正在分享我自己的理解，這可能會對以後的人有所幫助。