AppSheetからApigee経由でREST APIを呼び出す

はじめに

AppSheetを使うと、本当に簡単にノーコードでアプリを開発できます。ただ、手元のスプレッドシートを活用する個人用ではなく、企業内で統制をとりながら本格的に業務利用するには、API呼び出しによるビジネスロジックとの連携が必要になるでしょう。

ということで、最近正式にサポートされたApigeeによるREST連携が、どんな感じで使えるのか試してみました。 おそらくもっともシンプルな手順になっているかと思いますので、手短にAppSheet＋Apigeeの動作検証してみたい方がいらっしゃれば、参考にしてみてください。

ゴール

AppSheetからApigeeデータソースを経由してREST APIを呼び出してみる。以下公式ページにある動画みたいなことを自分の環境でやりたい。 

https://help.appsheet.com/en/articles/4438873-apigee-data-source

前提

• 一番手軽かつ安価に試せること。そのため、Apigeeは評価アカウントを利用すること。
• AppSheetからApigeeへの接続には「Open APISpec」と「Manual」の二通りの方式があるが、AppSheet推奨の「Open APISpec」方式で試すこと。※ManualだとRead Onlyでデータの一覧取得しかできない
• 呼び出すAPIはモック（固定の値を返す）。
• （極力）コードを書かない！

事前準備

１．Apigee Edge 評価アカウントの作成

以下手順でApigee Edge の評価アカウントを作成します。評価アカウントは60日無料で利用できます。

https://docs.apigee.com/api-platform/get-started/create-account?hl=ja 

注意！Apigee は大きく、Google Cloudと統合されている「Apigee on Google Cloud」と、そうではない「Apigee Edge for Public Cloud」の2系統がある。当然コンセプトやツールの使い勝手はほぼ同じだが、前者の評価アカウントは、GCPのVPC外部からの接続ができない（AppSheetから繋がらない）ので今回の評価では利用しなかった。というか途中で気が付いてEdgeに切り替えた。違いについて詳しく知りたい方は公式ドキュメントを参照。https://cloud.google.com/apigee/docs/api-platform/get-started/compare-apigee-products?hl=ja

２．テスト用APIの用意

テスト用のAPIを用意します。モックで構いません。ただしAppSheetから利用するには仕様に制限があるので注意してください。https://help.appsheet.com/en/articles/4438873-apigee-data-source にあるとおり、レスポンスがAppSheetのTable（RDBのような表形式）して扱える形式である必要があります。

特に、AppSheetでテーブル名として扱われる配列のプロパティ名設定を忘れないようにしましょう。以下画像のソース中の”persons”の部分です。

今回の検証ではCloud Functionsを利用したのですが（試す程度なので無償の範囲で収まる）、例えば、https://jsonplaceholder.typicode.com/  のようなサービスでも良いです。なんにせよ、ブラウザやテストクライアントツールを使ってこのAPIが値を返すことを確認できてから、検証に入ります。

Cloud Functionsで作成したモックAPI

検証手順 

まずはApigee Edge側の設定です。実際は必ずしも以下手順通りでなくても良いのですが、最も早く筋がよさげなやり方でやってみました。

１．Specの作成

OpenAPI Spec3.0にてAPI仕様を書きます。メニューの「Develop ＞ Specs ＞ ＋Spec ＞ New Spec」を実行すると、サンプルが表示された状態でエディタが起動するので、これを手直しする形で進めると簡単です。

参考：https://docs.apigee.com/api-platform/tutorials/create-api-proxy-openapi-spec

Specエディタ。起動するとサンプルが表示される。

注意！サンプルでは「openapi: 3.0.3」とあるが、このままだと次のステップのAPI Proxy生成時にエラーとなる。openapi: 3.0.0 に修正すること。 

実際に作成したSpecは以下のGitHubリポジトリにあります。サンプルを元に作っているのでGETメソッドに対応するものしかなく、値を取得することしかできませんが、今回の検証には十分です。

https://github.com/HappymanOkajima/apigee-eval/blob/main/persons-mock-api.yaml

 仕様を書く上で大切なのが、serversと、paths。serversには実際のAPIのエンドポイントを指定し、今回だとCloud Functionsで作ったAPIのURLとなります。

なお、AppSheetはこのデータソース作成時にこのSpecを読むことで、APIがどのようなインターフェースなのか、つまりTableの名称やカラムについての情報を読み取る仕組みとなっています。一方「Manual」の場合はSpecがないので、接続先のApigeeのエンドポイントだけでなくテーブル名をResourece Pathとして別途指定してやる必要があります。

AppSheetのApigeeデータソース設定（OpenAPI Spec）

２．API Proxyの作成

いよいよAppSheetから呼び出されるAPI Proxyを作りますが、ここではAPIのSpecから自動生成してみます。「Develop ＞ API Proxies ＞ ＋Proxy」を実行し、次に「Reverse Proxy(most commn）の下にある「Use OpenAPI Spec」をクリックし、表示されるポップアップのMy Specより、先ほど作成したSpecを選択します。 

API Proxy作成画面

Spec選択用ダイアログ

うまく行くと次のような画面が表示されます。必要な項目はSpecから読み取られ、あとは必要に応じて設定を見直していけばよいウィザードスタイルです。「Target（Exitsing API）」に、Specのserversで指定したものが設定されていることを確認し、「Next」をクリックします。

API Proxy設定ウィザード画面

次はポリシー（Policies）の設定です。Apigeeのポリシーは柔軟かつ強力で、コードを書かず、かつ、ターゲットのAPIに手を加えずに、セキュリティやクオータ、キャッシュなどの機構を挟みこむことができるメカニズムです。

ポリシー設定画面

AppSheetからの接続にはAPI Keyが必要となるので「Security:Authorization」を「API Key」に変更します。ポリシーは当然後から追加することも可能ですが、ここでやってしまうと少し楽になります。 

あとはウィザードに従い手順を進めます。

オペレーション選択画面

バーチャルホストの設定画面

デプロイ前の確認画面。とりあえずtest環境のみデプロイする設定に

設定完了。「Edit proxy」を実行

デプロイ完了

３．APIキーの発行

AppSheetからの接続に必要となるAPIキーを発行するには、API Proxyに加え、「API Product」「App」「Developer」を作成する必要があります。APIキーは「App」の「Credentials」に設定されることになりますが、「App」を作るには「Product」と「Developer」が必要となるため、先にこれらを作ります。

Apps設定画面のCredentialsグループに表示されるAPIキー

API Productを作る

メニューの「Publish ＞ API Products ＋API Product」より、必要項目を入力しSaveします。大切なのは、「API proxies」で、ここで先ほど作成したAPI Proxyを選択します。

API Product設定画面

API resourceの選択ダイアログ

とりあえず他の項目は必要最低限の確認と設定としました。

Developerを作る

次に「Publish ＞ Developers ＞＋Developer」より、Developerを作成します。メールアドレスにはとりあえずApigee Edgeにログインしているものを指定すれば良いでしょう。

Developerの設定画面

Appを作る

最後に「Publish ＞ Apps ＞ ＋App」より、Appの作成です。

Appの設定画面

Developerには、先ほど作成したDeveloper（アカウント）を指定します。

Productには、同様に先ほど作成したProductを選択します。

Product選択ダイアログ

その後Saveすると、CredentialsにAPIキー（Key）が表示されます。「Show」をクリックすると実際の値が表示されるので、これをAppSheetから指定することになります。（※ AppおよびAPIキーは、４．で説明するポータルからアカウント毎に作成することも可能です）

App設定画面。Keyが表示された

３．ポリシーの修正

APIキーは作成できたましたが、実はまだこのままではAppSheetとApigeeは繋がりません。AppSheetはHTTPヘッダ（x-apikey）でAPIキーを指定する仕様ですが、先ほどウィザードでSpecから作成したAPI Proxy（のポリシー）は、クエリーパラメータでAPIキーを指定する動作となるからです。そのため、ポリシーの内容を手で若干修正し、HTTPヘッダによるキー受け渡しに変更する必要があります。

 手順は以下ドキュメントの「ベストプラクティス：HTTPヘッダでキーを渡す」に従えば良いので説明は割愛します。

 https://docs.apigee.com/api-platform/tutorials/secure-calls-your-api-through-api-key-validation?hl=ja#extracreditpassingthekeyinthehttpheader

４．Portalの作成

AppSheetから接続する前に、やっておきたいことがあります。Portal（開発者用の専用サイト）の作成です。メニューの「Publish ＞ Portals ＞ ＋Portal」から簡単に作成できて、このポータルから、AppSheetのデータソースを作成するときに必要な「OpenAPI Spec URL」をホストすることもできて便利です。

Portal設定画面

まずは「API catalog」から設定しましょう。

API catalog設定画面

「＋」を押して、どのAPI Product用のポータルなのかを指定します。

API productの選択ダイアログ

引き続き、適宜項目を設定します。「Source API spec」の指定を忘れないようにしましょう。これを指定することによって、開発者はポータルからAPIのSpecをダウンロードできるようになります。 

API details設定画面

注意！Audienceの設定をデフォルトのアノニマスにしておかないと、この後の手順でAppSheetから「DOWNLOAD SPECのURL」を指定しValidateする際にエラーとなる。おそらくAppSheetがホストされているサーバーから読み取れないから。

あとは、Users の指定ですが、ポータルを利用するユーザーは、この画面からではなく、実際のポータルから登録します。画面右上の「Live Portal」を開いてください。

Users設定画面。右上の「Live Portal」リンクを開く

すると次のようなページが表示されます。それっぽいですね。デザインなどもカスタマイズできますが、今回はそのままでいきます。

開発者用ポータルページのトップ

まずは「Sign In」からアカウントを作成します。「Create an account」から直感的アカウントを登録できるので、そのままメールによるアクティベイトまで終わらせましょう。

 サインインし、「APIs」を見てみると、次のような画面が表示されるはずです。

開発者用ポータルのAPIページ

今回作成したAPIのページを見てみる

このページから実際にAPIをテスト実行したり、Spec を右上の「DOWNLOAD SPEC」からダウンロードできます。

 もちろんAppはポータルからも作成することができて、そこからAPIキーを入手することが可能です。ポータルの右上のアカウントのところがメニューになっており、そこから「Apps」を選択し、その後表示される画面から「＋New App」を実行します。

開発者ポータルからのApp登録

このような画面が表示されるので、利用したいAPIを「Enable」に設定し「CREATE」することで、Appが作成され、API Keyも作成されます。

５．AppSheetリソースの作成

いよいよ、AppSheetでの作業です。ここまでの手順で「Apigee API Key」と「OpenAPI Spec URL」は手に入っているはずなので、それぞれ、APIキーと、ポータルページの「DOWNLOAD SPEC」のURLをコピー＆ペーストで入力し、「Validate」を実行します。

AppSheetのApigeeデータソース設定（OpenAPI Spec）

順調に行けば、エラーメッセージが表示されず「Authorize Access」ボタンが押せるようになります。後は、以下AppSheetのマニュアルの動画通りに進めればOKでした。

 https://help.appsheet.com/en/articles/4438873-apigee-data-source

このような感じで、personsテーブルとしてApigee ProxyのAPIが表現されています。

AppSheetの画面。Apigeeに接続できた

補足

AppSheetからManualで接続する場合

「Apigee API Base Path」には、API ProxyのURL（今回の場合はhttps://okajima-eval-test.apigee.net/persons-api）を、「API Resource Paths (comma separated)」には、テーブル名（今回の場合は persons ）を設定します。

 今回作成した（ポリシーでHTTPヘッダによるAPIKey必須とした）API Proxyは当然指定する必要がありますが、実は「Apigee API Key」は必須ではありません。APIキー不要なAPI Proxyであれば、指定する必要はありません。

POST、PUT、DELETEを含むAPIの場合

ここまではGETのみのSpecで進めてきましたが、実務ではデータの追加や更新、削除を行うAPIも必要となります。例えば以下のようなSpecを準備し、ここまでの説明と同じような流れ（API Proxyを生成し…）で進めることができるので、試してみてください。

 https://github.com/HappymanOkajima/apigee-eval/blob/main/eval-mockapi.yaml

検証してみて

Apigee Edgeがプロキシとなることで、APIキーなどの制御を元々のAPI側で意識せずアドオンできるのがいい感じでした。また、Apigee Edgeはツールの使い勝手も良く、ドキュメントも日本語で充実しているのが嬉しいです。

 AppSheetからAPI呼び出しするには他にActionからのWebhook呼び出しを使う手もありますが、Webhookの性質上呼びっぱなしとなるので、企業内の既存システムと密に連携するならApigeeデータソースを使うのが良さそうですね。

Googleは Business Application Platform という動きを始めていますし、ノーコードと企業システムとの連携という意味では、AppSheet Automation 含め注目です。 

残課題

AppSheetから接続はできたものの、APIがモックなので「実際に値が更新できるのか？」「性能は？」などの検証はできていません。近々試してみたいと思います。

その他参考になったリソース

今回の記事はApigeeやOpenAPIの概念や用語の説明を省いています。必要に応じて以下のエントリなどを参考にしていただければと思います。

• https://www.apps-gcp.com/apigee-overview/
  Apigeeの用語や概念がわかりやすく説明してありとても助かった。

• https://www.apps-gcp.com/openapi_learn_the_basics/
  Apigee Edgeを試しながらOpenAPIの基礎が学べる。※ 2019年の記事なのでV3からV2への変換が必要とあるが、現在のApigee EdgeはV3.0仕様も変換できる。

• https://qiita.com/teinen_qiita/items/e440ca7b1b52ec918f1b
  OpenAPIの解説記事。
• https://qiita.com/teinen_qiita/items/e440ca7b1b52ec918f1b
  同じくOpenAPIの解説記事。
• https://qiita.com/yuuman/items/b4a6e783f48afbeade8c
  2018年の記事だが基本的な手順の参考になった。
• https://docs.apigee.com/api-platform/reference/glossary
  Apigee Edge公式用語集。