Teams 会議ステージ用のアプリを構築する

次の図は、Teams デスクトップ クライアントの [ステージへの共有] オプションを示しています。

次の図は、Teams モバイル クライアントの [ステージへの共有] オプションを示しています。

shareAppContentToStage API を使用すると、アプリの特定の部分を会議ステージに対して共有できます。 API は TeamsJS ライブラリを介して使用できます。

validDomains配列では、manifest.json内のappContentUrlを許可する必要があります。 それ以外の場合、API は 501 エラーを返します。

次のコードは、 shareAppContentToStage API の例です。

const appContentUrl = "https://www.bing.com/";

microsoftTeams.meeting.shareAppContentToStage((err, result) => {
    if (result) {
        // handle success
    }
    if (err) {
        // handle error
    }
}, appContentUrl);

クエリ パラメーター

次の表に、クエリ パラメーターを示します。

getAppContentStageSharingState API を使用すると、会議ステージでアプリの共有に関する情報を取得できます。

次の表は、 getAppContentStageSharingState API の例です。

microsoftTeams.meeting.getAppContentStageSharingState((err, result) => {
    if (result.isAppSharing) {
        // Indicates if app is sharing content on the meeting stage.
    }
});

getAppContentStageSharingState API の JSON 応答本文は次のとおりです。

{
  "isAppSharing": true
}

クエリ パラメーター

次の表に、クエリ パラメーターを示します。

getAppContentStageSharingCapabilities API を使用すると、アプリのコンテンツを会議ステージに共有するためのアプリの機能をフェッチできます。 アプリは、 getAppContentStageSharingCapabilities API を呼び出して、会議側パネルで会議参加者のカスタム共有をステージ ボタンに有効または無効にする必要があります。 会議参加者がアプリ コンテンツを会議ステージに共有するアクセス許可がない場合は、[ステージ間共有] ボタンを無効または非表示にする必要があります。

アプリ共有機能は、テナント ユーザーの種類と会議の参加者ロールによって異なります。

• ユーザーの種類: テナント内、ゲスト、および外部のユーザーの種類の参加者は、ステージにアプリを共有したり、ステージで共有されているアプリを表示したり操作したりできます。 匿名ユーザーは、ステージで共有されているアプリを表示、共有、または操作できません。 詳細については、「会議のユーザーの種類」を参照してください。

• ユーザー ロール: 会議で発表者と開催者のユーザー ロールを持つ参加者は、アプリをステージに共有できます。 [ステージ間の共有] ボタンと、アプリをステージに共有する機能は、出席者に対して有効になっていません。 詳細については、「Teams 会議のユーザー ロール」を参照してください。

次のコードは、 getAppContentStageSharingCapabilities API の例です。

microsoftTeams.meeting.getAppContentStageSharingCapabilities((err, result) => {
    if (result.doesAppHaveSharePermission) {
        // Indicates if the meeting participant has permission to share content to the meeting stage.
    }
});

getAppContentStageSharingCapabilities API の JSON 応答本文は次のとおりです。

{
   "doesAppHaveSharePermission":true
} 

クエリ パラメーター

次の表に、クエリ パラメーターを示します。

   // Share the content to meeting stage view.
    const shareSpecificAppContent = (partName) => {
        var appContentUrl = "";
        microsoftTeams.app.getContext().then((context) => {
            appContentUrl = partName == 'todo' ? `${window.location.origin}/todoView?meetingId=${context.meeting.id}` : partName == 'doing' ? `${window.location.origin}/doingView?meetingId=${context.meeting.id}` : `${window.location.origin}/doneView?meetingId=${context.meeting.id}`;
            microsoftTeams.meeting.shareAppContentToStage((err, result) => {
                if (result) {
                    // handle success
                    console.log(result);
                }

                if (err) {
                    // handle error
                    alert(JSON.stringify(err))
                }
            }, appContentUrl);
        });
    };

  // Share the content in view-only screen sharing mode.
      const shareSpecificAppContentScreenShare = (partName) => {
          var appContentUrl = "";
          microsoftTeams.app.getContext().then((context) => {
              appContentUrl = partName == 'todo' ? `${window.location.origin}/todoView?meetingId=${context.meeting.id}` : partName == 'doing' ? `${window.location.origin}/doingView?meetingId=${context.meeting.id}` : `${window.location.origin}/doneView?meetingId=${context.meeting.id}`;
              microsoftTeams.meeting.shareAppContentToStage((err, result) => {
                  if (result) {
                      // handle success
                      console.log(result);
                  }

                  if (err) {
                      // handle error
                      alert(JSON.stringify(err))
                  }
              }, appContentUrl,
                  // Optional shareOptions with sharingProtocol set to ScreenShare
                  {
                      sharingProtocol: microsoftTeams.meeting.SharingProtocol.ScreenShare
                  });
          });
      };