既存の API 用のカスタムコネクタを構築する

20 分

この演習では、Contoso Invoicing という既存の API に対して最初のカスタムコネクタを作成します。

重要

Microsoft Dataverse がプロビジョニングされているテスト環境を使用してください。テスト環境がない場合は、Power Apps コミュニティプランに新規登録できます。

タスク: API を確認する

API を確認するには、次の手順に従います。

Contoso Invoicing に移動します。
ドキュメントのリンクを選択します。
使用できる操作を確認します。
各操作を選択して展開および確認します。
ドキュメントのブラウザーのタブまたはウィンドウを閉じます。
Open API 定義のリンクを選択します。
次の図は、ドキュメントのページに表示された OpenAPI のバージョンの例を示しています。右クリックして、名前を付けて保存を選択します。
ファイルをローカル環境に保存します。このファイルは、後でこの演習で使用します。
定義のブラウザーのタブまたはウィンドウを閉じます。
API キーのリンクを選択します。
この API キーは後で必要になるため、コピーして保存します。
ホームに戻るを選択します。
ロゴをダウンロードを選択します。
ロゴ画像をローカルに保存します。これは後で使用します。

タスク: 新しいソリューションを作成する

新しいソリューションを作成するには、次の手順に従います。

Power Apps 作成者ポータルに移動し、適切な環境にいることを確認します。
ソリューション > + 新しいソリューションを選択します。
表示名に Contoso Invoicing と入力し、+ 新しい公開元を選択します。
[表示名] に Contoso、[名前] に Contoso、[接頭辞] に contoso と入力し、保存を選択します。
公開元の Contoso を選択して、作成を選択します。実際のプロジェクトで作業している場合は、独自の公開元を作成してください。
作成を選択した後も、このページから移動しないでください。

タスク: 新しいコネクタを作成する

新しいコネクタを作成するには、次の手順に従います。

作成した Contoso Invoicing ソリューションを開きます。
+ 新規 > 自動化 > カスタムコネクタを選択します。
コネクタ名に Contoso Invoicing と入力し、画像のアップロードを選択します。
タスク 1: API を確認するでダウンロードしたコネクタのロゴ画像を選択します。
アイコンの背景色に #175497 を入力します。
説明に Contoso Invoicing API のカスタムコネクタと入力します。
ホストに contosoinvoicingtest.azurewebsites.net と入力します。
コネクタの作成を選択します。
このページから移動しないでください。

タスク: OpenAPI 定義をインポートする

OpenAPI 定義をインポートには、次の手順に従います。

コネクタ名の横にある矢印を選択します。
コネクタの省略記号 (...) ボタンを選択して、OpenAPI ファイルから更新するを選択します。
インポートを選択します。
タスク 1: API を確認するでダウンロードした swagger.json ファイルを選択して、開くを選択します。
続行を選択します。
ホスト URL に contosoinvoicingtest.azurewebsites.net と入力し、セキュリティを選択します。
フィールドがインポートしたファイルから入力されます。
このページから移動しないでください。

タスク: 定義を確認および調整する

定義を確認および調整するには、次の手順に従います。

定義タブを選択します。
インポートした操作をしばらく確認します。
GetInvoice の横にある情報を示す青色の丸に注目してください。
GetInvoice 操作を選択します。
この操作には概要がないことがわかります。
ユーザビリティを向上させるために、概要に請求書の取得と入力します。
PayInvoice 操作の横に情報を示す青色の丸が表示されており、説明がないことがわかります。
説明に請求書の支払いと入力します。
NewInvoice 操作は使用しないため、どちらも削除します。
GetInvoiceSchema 操作を選択します。
表示オプションを内部に変更して、ユーザーのアクションリストに表示されないようにします。
コネクタの更新を選択します。
このページから移動しないでください。

タスク: コネクタをテストする

コネクタをテストするには、次の手順に従います。

テスト タブを選択します。
+ 新しい接続を選択します。
タスク 1: API を確認するで保存した API キーを貼り付けて、接続の作成を選択します。
更新ボタンを選択します。
ListInvoiceTypes > 操作のテストを選択します。
本文の領域に請求書タイプデータが表示されます。

タスク: キャンバスアプリでカスタムコネクタを使用する

このタスクでは、キャンバスアプリケーションを作成し、作成したカスタムコネクタを使って請求書の一覧を表示します。

Power Apps Maker portal に移動して、正しい環境にいることを確認します。
ソリューションを選択し、作成した Contoso Invoicing ソリューションを開きます。
+ 新規を選択し、アプリ > キャンバスアプリの順に選択します。
アプリ名として Contoso Invoicing アプリと入力して、[形式] で電話を選択し、作成を選択します。
データ タブを選択して、+ データの追加を選択し、コネクタを展開した後、作成した Contoso Invoicing カスタムコネクタを選択します。
+ コネクタの追加を選択します。
「タスク 1: API を確認する」で保存した API キーを貼り付けて、接続を選択します。
プレミアム警告ポップアップで了解を選択します。
ツリービュー タブを選択します。
+ 挿入、垂直ギャラリーの順に選択します。
データとして ContosoInvoicing を選択します。

品目を以下の値に設定します。

ContosoInvoicing.ListInvoices().invoices

ギャラリーを展開し、Subtitle を選択します。
Subtitle の Text の値を ThisItem.amount に設定します。
ギャラリーを展開し、ギャラリー内の Title を選択します。
Title の Text の値を ThisItem.accountName に設定します。
これでギャラリーは以下の画像のようになります。