ビデオチャット– tag –

NuxtとWebRTCで作るビデオチャット連載の最終回。宛先付きシグナリングと参加者ごとの接続で最大4人のメッシュ通話を実装し、人数による通信量の増え方を実測。SFUの選択肢と本番までの残作業も整理。

NuxtとWebRTCで作るビデオチャット連載の第10回。WebSocketの指数バックオフ再接続、restartIceによる経路の復旧、利用者向けの状態表示を実装。サーバー再起動やTURN障害で検証した結果も紹介。

NuxtとWebRTCで作るビデオチャット連載の第9回。MediaRecorderとisTypeSupportedでブラウザ内の録画を実装し、了承の確認と相手への録画中表示を追加。保存・同意・管理など発注前に決めることも解説。

NuxtとWebRTCで作るビデオチャット連載の第8回。DataChannelをnegotiatedで作り、サーバーを通さずにテキストチャットを送受信。offer衝突を避ける作成タイミング、文字数の数え方、受信データの検証を解説。

NuxtとWebRTCで作るビデオチャット連載の第7回。getDisplayMediaで画面を取得し、replaceTrackで再交渉なしにカメラ映像と差し替える画面共有を実装。停止ボタンでの自動復帰や対応端末の注意点も解説。

NuxtとWebRTCで作るビデオチャット連載の第6回。社外とつながらない原因とTURNの役割を解説し、時間制限付きTURN認証情報を発行するAPI、relayモードでの検証、HTTPS・WebSocketのデプロイ構成を紹介します。

NuxtとWebRTCで作るビデオチャット連載の第5回。track.enabledでマイクのミュートとカメラオフを実装し、シグナリングで状態を相手に伝えて表示します。途中参加者への状態同期や発注時の確認点も解説。

NuxtとWebRTCで作るビデオチャット連載の第4回。UUIDでルームを作成して招待リンクをコピーし、入室前にカメラを確認。定員超過はシグナリングサーバーで断ります。入室管理で発注時に決める点も解説。

NuxtとWebRTCで作るビデオチャット連載の第3回。RTCPeerConnectionとPerfect negotiationでoffer/answer/ICE候補を交換し、1対1のビデオ通話をつなぎます。2タブでの確認方法も解説。

NuxtとWebRTCで作るビデオチャット連載の第2回。Nuxt 4（Nitro v2）の実験的WebSocketでシグナリングサーバーを作り、ルーム単位の中継、メッセージの型共有と検証、ブラウザ側の接続処理を実装します。

NuxtとWebRTCで作るビデオチャット連載の第1回。getUserMediaでカメラ・マイクをプレビューし、enumerateDevicesでデバイス選択、許可拒否・未接続・使用中のエラー表示まで実装します。

NuxtとWebRTCでビデオチャットを作る連載の第0回。全体像と全12回の目次、Nuxt 4の土台作り、カメラ・マイクにHTTPS（Secure Context）が必要な理由と、LANのスマホで動かない原因・確認方法を解説します。