ミーティングに関するメタデータは、すべて meeting.meta に格納されます。ミーティングの状態、種類、接続に関する重要な情報が含まれます。
構築するプラットフォームに合わせてフレームワークを選択します。
meeting.meta オブジェクトには、次のプロパティがあります。
viewType- ミーティングの種類です。取りうる値はWEBINAR、GROUP_CALLですroomType- ミーティングがグループコールかウェビナーかを示しますmeetingTitle- ミーティングのタイトルですmeetingStartedTimestamp- ミーティング開始時刻ですmediaState- メディア接続の状態ですsocketState- ソケット接続の状態です
meeting.meta オブジェクトには、次のプロパティがあります。
viewType- ミーティングの種類です。取りうる値はWEBINAR、GROUP_CALLですroomType- ミーティングがグループコールかウェビナーかを示しますmeetingTitle- ミーティングのタイトルですmeetingStartedTimestamp- ミーティング開始時刻ですmediaState- メディア接続の状態ですsocketState- ソケット接続の状態です
meeting.meta オブジェクトには、次のプロパティがあります。
meetingId- ミーティングの一意な識別子ですmeetingTitle- ミーティングのタイトルですmeetingStartedTimestamp- ミーティング開始時刻ですmeetingType- ミーティングの種類です。RtkMeetingTypeenum のGROUP_CALL、WEBINAR、AUDIO_ROOM、LIVESTREAMのいずれかですmeetingConfig- 音声と動画の設定を含むミーティング構成ですmeetingState-RtkMeetingState型のミーティング状態ですauthToken- ミーティング用のユーザー認証トークンですselfActiveTab- ローカル参加者の現在のアクティブタブに関する情報ですmediaConnectionState- メディア接続の現在の状態ですsocketConnectionState- ソケット接続の現在の状態です
meeting.meta オブジェクトには、次のプロパティがあります。
meetingId- ミーティングの一意な識別子ですmeetingTitle- ミーティングのタイトルですmeetingStartedTimestamp- ミーティング開始時刻ですmeetingType- ミーティングの種類です。RtkMeetingTypeenum の.groupCall、.webinar、.audioRoom、.livestreamのいずれかですmeetingConfig- 音声と動画の設定を含むミーティング構成ですmeetingState-RtkMeetingState型のミーティング状態ですauthToken- ミーティング用のユーザー認証トークンですselfActiveTab- ローカル参加者の現在のアクティブタブに関する情報ですmediaConnectionState- メディア接続の現在の状態ですsocketConnectionState- ソケット接続の現在の状態です
meeting.meta オブジェクトには、次のプロパティがあります。
viewType- ミーティングの種類です。取りうる値はWEBINAR、GROUP_CALLですroomType- ミーティングがグループコールかウェビナーかを示しますmeetingTitle- ミーティングのタイトルですmeetingStartedTimestamp- ミーティング開始時刻ですmediaState- メディア接続の状態ですsocketState- ソケット接続の状態です
ミーティングメタデータには、meeting.meta オブジェクトでアクセスします。
// Destructure the metadata to get meetingTitle
const { meetingTitle } = meeting.meta;
if (meeting.self.roomJoined) {
console.log(
`The local user has joined a meeting with title ${meetingTitle}.`,
);
}import { useRealtimeKitSelector } from "@cloudflare/realtimekit-react";
import { useEffect } from "react";
function MeetingInfo() {
const [meetingTitle, roomJoined] = useRealtimeKitSelector((m) => [
m.meta.meetingTitle,
m.self.roomJoined,
]);
useEffect(() => {
if (roomJoined) {
console.log(
`The local user has joined a meeting with title ${meetingTitle}.`,
);
}
}, [roomJoined, meetingTitle]);
return null;
}val meetingTitle = meeting.meta.meetingTitlelet meetingTitle = meeting.meta.meetingTitleimport { useRealtimeKitSelector } from "@cloudflare/realtimekit-react-native";
import { useEffect } from "react";
const [meetingTitle, roomJoined] = useRealtimeKitSelector((m) => [
m.meta.meetingTitle,
m.self.roomJoined,
]);
useEffect(() => {
if (roomJoined) {
console.log(
`The local user has joined a meeting with title ${meetingTitle}.`,
);
}
}, [roomJoined, meetingTitle]);meta オブジェクトは、ミーティングの接続状態の変化を示すイベントも発行します。
メディア接続(実際のメディア転送に使う WebRTC 接続)の更新は、mediaConnectionUpdate イベントで届きます。
meeting.meta.on("mediaConnectionUpdate", ({ transport, state }) => {
// transport - 'consuming' | 'producing'
// state - 'new' | 'connecting' | 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Media connection ${transport} is now ${state}`);
});mediaConnectionUpdate イベントは次の情報を提供します。
transport-'consuming'(メディア受信)または'producing'(メディア送信)state- 接続状態:'new'、'connecting'、'connected'、'disconnected'、'reconnecting'、'failed'
メディア接続(実際のメディア転送に使う WebRTC 接続)の更新は、mediaConnectionUpdate イベントで届きます。
import { useRealtimeKitClient } from "@cloudflare/realtimekit-react";
import { useEffect } from "react";
function MediaConnectionMonitor() {
const [meeting] = useRealtimeKitClient();
useEffect(() => {
if (meeting) {
const handleMediaConnection = ({ transport, state }) => {
// transport - 'consuming' | 'producing'
// state - 'new' | 'connecting' | 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Media connection ${transport} is now ${state}`);
};
meeting.meta.on("mediaConnectionUpdate", handleMediaConnection);
return () => {
meeting.meta.off("mediaConnectionUpdate", handleMediaConnection);
};
}
}, [meeting]);
return null;
}mediaConnectionUpdate イベントは次の情報を提供します。
transport-'consuming'(メディア受信)または'producing'(メディア送信)state- 接続状態:'new'、'connecting'、'connected'、'disconnected'、'reconnecting'、'failed'
現在のメディア接続状態は、メタデータから直接参照できます。
val mediaConnectionState = meeting.meta.mediaConnectionState現在のメディア接続状態は、メタデータから直接参照できます。
let mediaConnectionState = meeting.meta.mediaConnectionStateメディア接続(実際のメディア転送に使う WebRTC 接続)の更新は、mediaConnectionUpdate イベントで届きます。
meeting.meta.on("mediaConnectionUpdate", ({ transport, state }) => {
// transport - 'consuming' | 'producing'
// state - 'new' | 'connecting' | 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Media connection ${transport} is now ${state}`);
});mediaConnectionUpdate イベントは次の情報を提供します。
transport-'consuming'(メディア受信)または'producing'(メディア送信)state- 接続状態:'new'、'connecting'、'connected'、'disconnected'、'reconnecting'、'failed'
WebSocket 接続(チャット、投票、その他の基本的なシグナリングに使用)の更新は、socketConnectionUpdate イベントで届きます。
meeting.meta.on(
"socketConnectionUpdate",
({ state, reconnectionAttempt, reconnected }) => {
// state - 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Socket connection is now ${state}`);
if (reconnectionAttempt) {
console.log(`Reconnection attempt: ${reconnectionAttempt}`);
}
if (reconnected) {
console.log("Successfully reconnected");
}
},
);socketConnectionUpdate イベントは次の情報を提供します。
state- 接続状態:'connected'、'disconnected'、'reconnecting'、'failed'reconnectionAttempt- 再接続の試行回数(再接続中の場合)reconnected- 接続の再確立に成功したかを示す真偽値
WebSocket 接続(チャット、投票、その他の基本的なシグナリングに使用)の更新は、socketConnectionUpdate イベントで届きます。
import { useRealtimeKitClient } from "@cloudflare/realtimekit-react";
import { useEffect } from "react";
function SocketConnectionMonitor() {
const [meeting] = useRealtimeKitClient();
useEffect(() => {
if (meeting) {
const handleSocketConnection = ({
state,
reconnectionAttempt,
reconnected,
}) => {
// state - 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Socket connection is now ${state}`);
if (reconnectionAttempt) {
console.log(`Reconnection attempt: ${reconnectionAttempt}`);
}
if (reconnected) {
console.log("Successfully reconnected");
}
};
meeting.meta.on("socketConnectionUpdate", handleSocketConnection);
return () => {
meeting.meta.off("socketConnectionUpdate", handleSocketConnection);
};
}
}, [meeting]);
return null;
}socketConnectionUpdate イベントは次の情報を提供します。
state- 接続状態:'connected'、'disconnected'、'reconnecting'、'failed'reconnectionAttempt- 再接続の試行回数(再接続中の場合)reconnected- 接続の再確立に成功したかを示す真偽値
現在のソケット接続状態は、メタデータから直接参照できます。
val socketConnectionState = meeting.meta.socketConnectionState現在のソケット接続状態は、メタデータから直接参照できます。
let socketConnectionState = meeting.meta.socketConnectionStateWebSocket 接続(チャット、投票、その他の基本的なシグナリングに使用)の更新は、socketConnectionUpdate イベントで届きます。
meeting.meta.on(
"socketConnectionUpdate",
({ state, reconnectionAttempt, reconnected }) => {
// state - 'connected' | 'disconnected' | 'reconnecting' | 'failed'
console.log(`Socket connection is now ${state}`);
if (reconnectionAttempt) {
console.log(`Reconnection attempt: ${reconnectionAttempt}`);
}
if (reconnected) {
console.log("Successfully reconnected");
}
},
);socketConnectionUpdate イベントは次の情報を提供します。
state- 接続状態:'connected'、'disconnected'、'reconnecting'、'failed'reconnectionAttempt- 再接続の試行回数(再接続中の場合)reconnected- 接続の再確立に成功したかを示す真偽値
関連トピック:
- ミーティングオブジェクトの解説 - ミーティングオブジェクトの包括的なリファレンス
- セッションのライフサイクル - ミーティングの状態と遷移