Chime SDK は Vue JS を使用してすべてのビデオ タイルを表示し、ライブ出席者リストを表示します

Question

共有ビデオ会議に関しては、ローカル タイルとリモート タイルについて何度も聞いたことがあります。すべての出席者のビデオタイルを表示しようとしていますが、AWS Chime SDK を使用するのは初めてなので、Vue JS を使用してアプリを最初から作成するときに困難に直面しています。以下のような質問があります。

ローカル タイル (getAllVideoTiles) とリモート タイル (getAllRemoteVideoTiles) の違いは何ですか?

すべての出席者の名前とともにビデオ タイルを表示するにはどうすればよいですか?

出席者名を追加するにはどうすればよいですか?どこに渡せばいいですか？ createAttendee または createMeeting API?

ホストを識別するにはどうすればよいですか?

ライブ チャットと接続中の出席者リストをミーティングに追加するにはどうすればよいですか?

React ライブラリが利用可能です。 Javascript のデモもコードが多く、初心者にとってはあまり理解に役立たないと思います。 Vue JS とそのデモを使用する機会はありますか?

あなたの回答は、近い将来、新しい開発者にとって非常に役立ち、感謝されるでしょう。どうもありがとう。

現在、自分自身と出席者タイルのみを表示するオブザーバーがあります。

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 ドキュメントを読んで完成させたときに理解した内容を、将来誰かに役立つ可能性がある私自身の理解を共有します。