会議の作成とカスタマイズ

Meetings API を使用すると、リアルタイムの高品質な対話型ビデオ会議を Web アプリケーションに統合できます。カスタマイズを制限したプラグアンドプレイのミーティングをお望みの方に最適で、わずか数行のコードでミーティングを生成し、アプリケーションに組み込むことができます。

このユースケースでは、アプリケーション用にカスタマイズされた会議室を作成するためにcURLリクエストを作成します。

そのために、ミーティングを作成する際に利用可能なオプションを確認します:

  1. 基本リクエストを作成する - 基本的な会議室のcURLリクエストから始める。
  2. 参加承認の設定 - 会議に参加するために必要な承認レベルを設定します。
  3. ローカライゼーション - UIに表示したい言語を選択します。
  4. 有効にしたい機能を選ぶ - 録画、チャット、ホワイトボードのオプションを有効/無効にします。
  5. 会議のテーマを変える - 必要に応じてカスタムテーマを適用する。
  6. リクエストを実行する - 会議を作成します!この時点で、ミーティングを使用する準備が整いましたが、次のステップに従ってミーティングを埋め込むこともできます。
  7. アプリケーションに会議を組み込む - iFrameを作成し、ウェブサイトやアプリケーションにミーティングを埋め込むことができます。

前提条件

チュートリアルを完了するには

  • Vonageデベロッパーアカウント:まだアカウントをお持ちでない方は、下記より無料アカウントをご登録ください。 Vonageデベロッパーアカウント.

  • アプリケーションIDとシークレット:にログインしたら Vonage APIダッシュボードアプリケーションをクリックし、新しいアプリケーションを作成します。をクリックしてください。 Generate public and private key と秘密鍵を記録する。秘密鍵とアプリケーションIDを使用して、以下のことを行います。 JSONウェブトークン(JWT)の生成.JWTの詳細については、以下を参照してください。 認証.また、Meetings APIがアプリケーションの「Capabilities」で有効になっていることを確認し、次のように入力します。 ウェブフックURL:

Enable the Meetings API for your application using the dashboard

基本リクエストを作成する

まず始めに、以下のcURLリクエストを使用して、デフォルトのオプションで基本的な会議室を作成することができます:

   curl -X POST 'https://api-eu.vonage.com/v1/meetings/rooms' \
   -H 'Authorization: Bearer $JWT' \
   -H 'content-type: application/json' \
   -d '{
   "display_name":"New Meeting Room"
               }'

以下のセクションでは、会議室をカスタマイズするために使用できる設定の詳細を説明します。

参加承認の設定

join_approval_level を使用して、会議に参加するために必要な承認レベルを設定できます。 以下のいずれかに設定する必要があります:

  • after_owner_only - 参加者がミーティングに参加するのは、ホストが参加した後である。
  • explicit_approval - 参加者は控え室に入り、ホストが承認/拒否を行う。
  • none - 承認は必要ない。

例えば、オーナーが入室を承認するまで、参加者を待合室で待機させるように会議室を設定したい場合があります。そのためには join_approval_level を以下のようにリクエストした:

   curl -X POST 'https://api-eu.vonage.com/v1/meetings/rooms' \
   -H 'Authorization: Bearer $JWT' \
   -H 'content-type: application/json' \
   -d '{
   "display_name":"New Meeting Room",      
   "join_approval_level":"explicit_approval"
    }'

ローカライゼーション

UIの言語は2つの方法で変更できる:

  1. APIコールで事前定義 - これは、APIコールのオプションを介して会議のすべての参加者のために事前に定義された言語を可能にします。
  2. UIからの選択 - UIに言語選択オプションが追加され、会議の各参加者が希望する言語を選択できるようになります。

このチュートリアルでは、APIコールを使って参加者全員に言語を適用します。 ローカライゼーション UIスイッチャーの詳細については、こちらをご覧ください。

言語を設定するには ui_settings をAPIコールに追加します。 language.この例では英語を使いますが、どの言語でも使えます。 対応言語:

   curl -X POST 'https://api-eu.vonage.com/v1/meetings/rooms' \
   -H 'Authorization: Bearer $JWT' \
   -H 'content-type: application/json' \
   -d '{
   "display_name":"New Meeting Room",      
   "join_approval_level":"explicit_approval",
   "ui_settings": {
       "language":"en"
       }
    }'

有効にしたい機能を選ぶ

ミーティング用に有効または無効にできる機能がいくつかあります:

  • 録音:会議の UI に録画オプションを表示します。を使用して設定します。 is_recording_available.
  • ホワイトボードホワイトボードをオンにするオプションが表示されます。を使用して設定します。 is_whiteboard_available.
  • チャットチャット機能を有効にします。設定方法 is_chat_available.

この例では、それぞれの機能を有効にするために available_features オブジェクトをAPIコールに渡す:

   curl -X POST 'https://api-eu.vonage.com/v1/meetings/rooms' \
   -H 'Authorization: Bearer $JWT' \
   -H 'content-type: application/json' \
   -d '{
   "display_name":"New Meeting Room",      
   "join_approval_level":"explicit_approval",
   "ui_settings": {
       "language": "en"
       },
    "available_features": {
        "is_recording_available": "true",
        "is_chat_available": "true",
        "is_whiteboard_available": "true"
      }
    }'

会議のテーマを変える

ミーティングはテーマでカスタマイズすることができ、異なる色、ロゴ、テキストを使用することができます。まず、こちらのガイドに従ってテーマを作成する必要があります。 theme_id 会議作成中にテーマを適用するために使用できます:

   curl -X POST 'https://api-eu.vonage.com/v1/meetings/rooms' \
   -H 'Authorization: Bearer $JWT' \
   -H 'content-type: application/json' \
   -d '{
   "display_name":"New Meeting Room",      
   "join_approval_level": "explicit_approval",
   "ui_settings": {
       "language": "en"
       },
    "available_features": {
        "is_recording_available": "true",
        "is_chat_available": "true",
        "is_whiteboard_available": "true"
      }, 
    "theme_id": "$THEME_ID"
    }'

リクエストを実行する

すべてのカスタマイズを設定したら、いよいよリクエストを実行します。ミーティングID、ホストとゲストの両方で参加するために必要なURLなど、ミーティングに関するすべての情報を含むコールバックが届きます:

{ "id": "$MEETING_ID", "display_name": "New Meeting Room", "metadata": null, "type": "instant", "expires_at": "2023-04-17T10:26:39.715Z", "recording_options": { "auto_record": false, "record_only_owner": false }, "meeting_code": "$MEETING_CODE", "_links": { "host_url": { "href": "$HOST_URL" }, "guest_url": { "href": "$GUEST_URL" } }, "created_at": "2023-04-17T10:16:39.716Z", "is_available": true, "expire_after_use": false, "theme_id": "$THEME_ID", "initial_join_options": { "microphone_state": "default" }, "joinApprovalLevel": "explicit_approval", "ui_settings": { "language": "en" }, "available_features": { "is_recording_available": true, "is_chat_available": true, "is_whiteboard_available": true, "is_locale_switcher_available": true, "is_captions_available": false } }

この時点で、会議を使用する準備が整いました!次のステップでは、ミーティングのURLに追加できるパラメータと、ミーティングをウェブサイトやアプリケーションに埋め込む手順を説明します。

URLパラメータ

また、会議のURLにオプションのパラメータを追加して、さまざまな機能を有効/無効にすることもできます:

パラメータ 効果 価値観
skip_prejoin ユーザーが参加前画面を見るか、直接会議に参加するかを決定します。 true または false
user_display_name 会議での参加者の名前を定義します。 テキスト
blur_on 会議に入ると自動的に背景ぼかしがオンになります。 true または false
blur_enabled これを無効にすると、会議の参加者は背景のぼかしのオン/オフを切り替えることができなくなり、会議のUIからボタンが削除されます。 true または false
background_enabled これを無効にすると、会議の参加者は背景を変更できなくなり、会議の UI からボタンが削除されます。 true または false
layout 会議のデフォルトレイアウトを設定します。 gallery:利用可能なすべての画面を表示します。 A meeting in the Gallery configuration
audience:中央にメイン発表者(スピーカーまたは共有スクリーン)、右側に他の参加者全員を表示します。 A meeting in the Gallery configuration
dominant:メインの発表者(スピーカーまたは共有画面)のみを表示します。 A meeting in the Gallery configuration

ホストURL

ホストURLに追加するには、パラメータを ? - たとえば、Audienceレイアウトを使用し、このURLでプレジョイン画面をスキップする:

https://meetings.vonage.com/?room_token=280674154&participant_token=eyJhbGciOiJIUzI1NiIsInR5cC

以下のパラメーターを追加する:

https://meetings.vonage.com/?room_token=280674154&participant_token=eyJhbGciOiJIUzI1NiIsInR5cC&skip_prejoin=true&layout=audience

ゲストURL

これらのパラメータを guest_url を追加する必要があります。 ?room_token= 部屋IDの前に

例えば、こうだ、 https://meetings.vonage.com/280674154 となる。 https://meetings.vonage.com/?room_token=280674154.その後、必要に応じて他のパラメーターをリストに追加できる。

アプリケーションに会議を組み込む

iFrameを使用すると、ウェブサイトやアプリケーションに会議を埋め込むことができます。置き換える GUEST_URL を以下のコードに追加してください:

<iframe src="$GUEST_URL" title="Embedded Meeting" allow="camera;microphone;display-capture"></iframe>

これにより、アプリケーションに会議が挿入され、ユーザーにカメラとマイクの許可を求めるプロンプトが表示されます。iFrameのサイズによって利用できる機能に制限があります。 これ.

また、以下のメールアドレスにリクエストを送信する必要があります。 ミーティング APIチーム を使用して、iFrame が使用されているウェブサイトのドメインをホワイトラベル化します。

結論

このチュートリアルでは、ニーズに合わせてカスタマイズした Meetings API を使用して会議を作成しました。Meetings API の詳細(会議室管理やコールバックなど)については、以下の「参考資料」を参照してください。

さらに読む