Teams アプリをクラウドに展開する

Teams Toolkit は、アプリ内のフロントエンドとバックエンドのコードを Azure のプロビジョニング済みクラウド リソースにデプロイまたはアップロードするのに役立ちます。

Microsoft Visual Studio Code を使用して Teams アプリをクラウドにデプロイする

次をクラウドにデプロイできます。

  • フロントエンド アプリなどのタブは Azure Storage にデプロイされ、静的 Web ホスティングまたは SharePoint サイト用に構成されます。

  • バックエンド API は、Azure Functionsにデプロイされます。

  • ボットまたはメッセージ拡張機能は、Azure App Serviceにデプロイされます。

    注:

    Azure クラウドにアプリ コードをデプロイする前に、 クラウド リソースのプロビジョニングを正常に完了する必要があります。

Teams Toolkit を使用して Teams アプリを展開する

「はじめに」ガイドは、Teams Toolkit を使用してデプロイするのに役立ちます。 次を使用して、Teams アプリをデプロイできます。

Teams アプリのワークロードの詳細

Teams アプリのワークロード ソース コード 成果物をビルドする ターゲット リソース
React
フロントエンド ワークロードを含むタブ
yourProjectFolder/tabs tabs/build Azure Storage
SharePoint
を使用したタブ フロントエンド ワークロード
yourProjectFolder/SPFx SPFx/sharepoint/solution SharePoint アプリ カタログ
Azure Functions
バックエンド ワークロードの API
yourProjectFolder/api × Azure Functions
ボットとメッセージ拡張機能
バックエンド ワークロード
yourProjectFolder/bot × Azure App Services

注:

プロジェクトに Azure API Management リソースを含め、デプロイをトリガーすると、Azure Functionsの API を Azure API Management サービスに発行できます。

Visual Studio を使用して Teams アプリをクラウドに展開する

次をクラウドにデプロイできます。

  • フロントエンド アプリなどのタブ アプリは、静的 Web ホスティング用に構成された Azure Storage にデプロイされます。
  • Azure Functions トリガーを含む通知ボット アプリは、Azure Functionsにデプロイできます。
  • ボット アプリまたはメッセージ拡張機能は、Azure アプリ Services にデプロイされます。

デプロイ後、アプリの使用を開始する前に、Teams クライアントまたは Web ブラウザーでアプリをプレビューできます。

Teams ツールキットを使用して Teams アプリを展開する

  1. Visual Studio を開きます。

  2. [新しいプロジェクトを作成する] を選択するか、一覧から既存のプロジェクトを開きます。

  3. プロジェクト MyTeamsApp4>Teams Toolkit>Deploy to the cloud... を右クリックします。

    [クラウドに展開する]

    注:

    このシナリオでは、プロジェクト名は MyTeamsApp4 です。

  4. 表示されるポップアップ ウィンドウで、[デプロイ] を選択 します

    [クラウドに展開する] の確認ダイアログ

    デプロイ プロセスが完了すると、正常にデプロイされたことを確認するポップアップが表示されます。 出力ウィンドウで状態を確認することもできます。

    [クラウドに展開する] のポップアップ

アプリをプレビューする

アプリをプレビューするには、 Zip アプリ パッケージ を作成し、Teams クライアントにサイドロードする必要があります。

  1. [Project>Teams Toolkit>Zip App Package] を選択します。

  2. [ ローカル] または [ Azure の場合 ] を選択して、Teams アプリ パッケージを生成します。

    Teams アプリ パッケージを作成する

Teams クライアントでアプリをプレビューするには

  1. [ Teams での Project>Teams ツールキット>プレビュー] を選択します

    Teams クライアントで Teams アプリをプレビューする

    これで、アプリが Teams にサイドロードされます。

    Teams クライアントで Teams アプリをサイドロードする

アプリをプレビューするもう 1 つの方法:

  1. [ソリューション エクスプローラー] でプロジェクト MyTeamsApp4 を右クリックします。

  2. [Teams ツールキット>プレビュー] を選択して、Web ブラウザーで Teams アプリを起動します。

    Web ブラウザーで Teams アプリをプレビューする

    注:

    同じメニュー オプションが [プロジェクト] メニューでも使用できます。

    これで、アプリが Teams にサイドロードされます。

    Teams クライアントで Teams アプリをサイドロードする

関連項目