このチュートリアルでは、ASP.NET Web API の構築を開始して Azure Web Apps でホストし、Azure Active Directory 認証を有効にした後、PowerApps に ASP.NET Web API を登録する方法について説明します。 API を登録すると、API に接続して、アプリから API を呼び出すことができます。

前提条件

ASP.NET Web API を作成して Azure にデプロイする

  1. Visual Studio で、[ファイル] > [新しいプロジェクト] の順にクリックし、新しい C# ASP.NET Web アプリケーションを作成します。

    新しい Web アプリ

  2. [Web API] テンプレートを選択します。 [クラウドにホストする] チェック ボックスはオンのままにします。 [認証の変更] をクリックします。

    新しい Web プロジェクト テンプレート

  3. [認証なし] を選択し、[OK] をクリックします。

    [認証なし]

  4. [新しい ASP.NET プロジェクト] ダイアログで [OK] をクリックします。 [Microsoft Azure Web App の構成] ダイアログが表示されます。

    [Microsoft Azure Web App の構成] ]

    Azure アカウントを選択し、Web アプリ名を入力 (または既定値のままに) して、Azure サブスクリプションを選択します。 App Service プラン (サブスクリプション内の Web アプリのコレクション) を選択または作成します。 リソース グループ (サブスクリプション内の Azure リソースのグループ) を選択または作成します。 Web アプリをデプロイするリージョンを選択します。 Web API で必要な場合は、Azure のデータベース サーバーを選択または作成します。 最後に、[OK] をクリックします。

  5. Web API を構築します。

    : まだ Web API のためのコードを準備していない場合は、チュートリアル「Getting Started with ASP.NET Web API 2 (C#)」(ASP.NET Web API 2 (C#) の使用を開始) を実行してください。

  6. Web API を PowerApps に接続するには、その操作が記述された OpenAPI ファイルが必要です。 オンライン エディターを使用して独自の OpenAPI を作成することもできますが、このチュートリアルでは、Swashbuckle というオープンソースのツールを使用します。 Visual Studio プロジェクトに Swashbuckle Nuget パッケージをインストールするには、[ツール] > [NuGet パッケージ マネージャー] > [パッケージ マネージャー コンソール] の順にクリックし、パッケージ マネージャー コンソールで Install-Package Swashbuckle コマンドを入力します。

    Install-Package Swashbuckle

    ヒント: Swashbuckle のインストール後で Web API アプリケーションを実行すると、http://<your root URL>/swagger/docs/v1 という URL に OpenAPI ファイルが生成されます。 生成されたユーザー インターフェイスは http://<your root URL>/swagger でも利用できます。

  7. Web API の準備ができたら、Azure に発行します。 Visual Studio から発行するには、ソリューション エクスプローラーで Web プロジェクトを右クリックし、[発行] をクリックして、[発行] ダイアログ ボックスの指示に従います。

  8. https://<azure-webapp-url>/swagger/docs/v1 に移動して OpenAPI JSON を取得します。 内容を JSON ファイルとして保存します。 ブラウザーによっては、テキストをコピーして空のテキスト ファイルに貼り付けることが必要になる場合があります。

    重要: 重複する操作 ID を含む OpenAPI ドキュメントは無効です。 サンプル C# テンプレートを使用している場合、操作 ID Values_Get が 2 回繰り返されています。 これを修正するには、一方のインスタンスを Value_Get に変更してから再発行します。 このチュートリアルでサンプルの OpenAPI ファイルをダウンロードすることもできます。 使用する前に、(// で始まる) コメントを必ず削除してください。

Azure Active Directory 認証を設定する

ここでは、2 つの Azure Active Directory (AAD) アプリケーションを Azure に作成します。 この方法の例については、Azure Resource Manager のチュートリアルを参照してください。

重要: 両方のアプリが同じディレクトリに含まれている必要があります。

1 つ目の AAD アプリケーション: Web API のセキュリティ保護

1 つ目の AAD アプリケーションは、Web API のセキュリティ保護に使用されます。 webAPI という名前を付けます。 次の値を使用して、前述のリンク先のチュートリアルの手順 (「*Azure Active Directory で認証を有効にする」) に従います。

  • サインオン URL: https://login.windows.net
  • 応答 URL: https://<your-root-url>/.auth/login/aad/callback
  • クライアント キーは必要ありません。
  • アクセス許可を委任する必要はありません。
  • 重要: アプリケーション ID をメモしておいてください。 これは後で必要になります。

2 つ目の AAD アプリケーション: カスタム コネクタのセキュリティ保護と委任されたアクセス

2 つ目の AAD アプリケーションは、カスタム コネクタの登録をセキュリティで保護し、1 つ目のアプリケーションで保護された Web API への委任されたアクセスを取得するために使用します。 このアプリケーションに webAPI-customAPI という名前を付けます。

  • サインオン URL: https://login.windows.net
  • 応答 URL: https://msmanaged-na.consent.azure-apim.net/redirect
  • Web API への委任されたアクセスを取得するためのアクセス許可を追加します。
  • このアプリケーションのアプリケーション ID も後で必要となるため、メモしておきます。
  • クライアント キーを生成し、それを安全な場所に保存します。 このキーは後で必要になります。

Azure Web アプリに認証を追加する

  1. Azure Portal にサインインし、最初のセクションでデプロイした Web アプリを見つけます。
  2. [設定] をクリックして、[認証/承認] を選択します。
  3. [App Service 認証] をオンにし、[Azure Active Directory] を選択します。 次のブレードで、[Express] を選択します。
  4. [既存の AD アプリを選択する] をクリックし、前に作成した webAPI AAD アプリケーションを選択します。

これで、AAD を使用して Web アプリケーションを認証できるようになります。

PowerApps にカスタム コネクタを追加する

  1. Web アプリに使用される securityDefintions オブジェクトと AAD 認証を追加するように OpenAPI ファイルを変更します。 OpenAPI ファイルの host プロパティを含むセクションは次のようになります。
// File header should be above here...

"host": "<your-root-url>",
"schemes": [
    "https"         //Make sure this is https!
],
"securityDefinitions": {
    "AAD": {
        "type": "oauth2",
        "flow": "implicit",
        "authorizationUrl": "https://login.windows.net/common/oauth2/authorize",
        "scopes": {}
    }
},

// The rest of the OpenAPI document follows...
  1. PowerApps にブラウザーでアクセスし、カスタム コネクタを PowerApps でのカスタム コネクタの登録と使用に関する説明に従って追加します。

  2. OpenAPI ファイルのアップロードが完了すると、ウィザードでは、Web API に AAD 認証が使用されていることが自動的に検出されます。

  3. カスタム コネクタの AAD 認証を構成します。

    • クライアント ID: "webAPI-CustomAPI のクライアント ID"
    • シークレット: "webAPI-CustomAPI のクライアント キー"
    • ログイン URL: https://login.windows.net
    • ResourceUri: "webAPI のクライアント ID"
  4. [作成] をクリックし、カスタム コネクタへの接続を作成します。

次のステップ

Azure Resource Manager カスタム コネクタ チュートリアルを実行します。