検索した店舗をNotionに追加する【サンプルあり】

Notion API x Shortcuts サンプル

お店の情報を一箇所にまとめておきたい

自分が行ったことのあるお店の情報をNotionにまとめています。Notionでまとめておけば、自分が感じた評価やお気に入りの商品などのメモを書いておけます。またビューを使えば思うような表にでき、探しやすいです。ページを作るには食べログやGoogleマップなどの検索サイトから情報を拾ってきますが、これをiPhoneのShortcutsを使って自動化しました。

iPhoneでShortcutsとPlaceAPI(new)を使用すると、テキストから検索したGoogleマップの情報を取得できます。お店の名前や住所、写真などの情報をNotionに登録する際に、PlaceAPIを使うことで手動で情報を入力する手間を省くことができます。

行きたいお店の情報をGoogleマップから取得し、Notionに登録するためのサンプルショートカットはこちらからダウンロードできます。使用しているNotionのデータベースはこちらです。

Places API(new) で店舗情報を取得する

店舗情報を取得するには、iPhoneのShortcutsというアプリ、GoogleマップのPlaces API(new) を使います。

Shortcuts の概要

Shortcutsは、アプリでの1つまたは複数の作業を素早く完了するための機能で、iOS、macOSで使うことができます。複数の手順を組み合わせて独自のショートカットを作ることができます。ショートカットの構成要素であるアクションはタスク内の一つの手順を指し、これを使ってAppleデバイス上のアプリやコンテンツだけでなく、インターネット上のコンテンツやサービスを操作するショートカットを作成できます。

Places API(new) の概要

Places API(new) は、Googleマップを使用して特定の場所や施設に関する情報を取得するためのAPIです。テキストや緯度・経度から店舗情報を検索することができます。Places API(new)は、Google Cloud Platformで利用できます。APIキーを取得し、それを使用してリクエストを送信することで、お店の情報を取得できます。

Places APIは従量課金制の料金モデルです。検索結果の情報量に応じて金額がかかります。大量のデータを検索してしまうと課金されてしまう可能性があるため注意が必要です。1回のAPI呼び出しに対して最大で0.040米ドル、約5.79円かかります。(2024/1/13時点 約5.79円)ただし登録時にトライアルとして300米ドル分、毎月無料クレジットとして200米ドル分が付与されるため、個人で使う分には十分でしょう。予算を決めてアラートを設定することもできるため、不安な方は設定しておきましょう。

Places API(new) には用途に合わせたAPIが準備されています。代表的なものをご紹介します。

  • Text Search (new)
    • テキスト情報を使って検索します。普段の使い方に近いイメージです。
  • Nearby Search (new)
    • 検索したい場所の中心点(緯度、経度)と半径を使って検索します。
  • Place Photo API
    • Googleプレイスのデータベースに保存されている写真にアクセスできます。

今回は自分の位置情報をもとに検索するためNearby Search (new) を、写真を取得するためPlace Photo APIをそれぞれ使います。

Place API

似た名前の Places API というAPIもあります。こちらは前のバージョンのAPIで、取得する情報の制限ができません。情報量が増えると料金が上がるため、よほどの理由がない限りはPlaces API(new)を使って情報を制限したほうが良いでしょう。

Places API(new)を使うための準備

Places API(new)を使うには事前にGoogleCloudPlatformよりAPI登録をする必要があります。

GoogleCloudPlatformでAPIをする手順

Google Cloud Platformのウェブサイトにアクセスし、ログインします。アカウントがない場合は新しく作成してください。

プロジェクトを作成する

左上のハンバーガーメニューから「IAMと管理 > リソースの管理」を選択します。

プロジェクトを作成を選びます。

次の画面でプロジェクト名を入力して「作成」を押すと、プロジェクトが作成できます。

プロジェクトで使用するAPIを指定する

作成したプロジェクトで使用するAPIを指定します。

作成したプロジェクトを選び、APIとサービスで Places API(New)を検索して選びます。

Places API(New) を有効にします。これで、このプロジェクトでPlaces API(New)を有効にすることができます。

APIキーを作成する手順

APIを叩く時には認証が必要です。次は認証情報を作成し、自分が作成するショートカットからのリクエストのみを受け付けるようにしましょう。

APIキーを作成する

GoogleCloudプラットフォームの画面上部から、先ほど作成したプロジェクトを選択した状態で、「鍵と認証情報」を選択します。

左上のハンバーガーメニューから「APIとサービス > 認証情報」を選択します。

「認証情報を作成 > APIキー」を選ぶとAPIキーが作成されます。このAPIキーは APIにアクセスするための鍵です。誰にも見られないように大切に保管してください。

作成したキーは一覧に表示されます。名前を選択してください。

名前をわかりやすいものにし、APIの制限でキーを制限、Places API(New) を選択しましょう。画面右にAPI Keyが表示されているので、コピーしてから保存を押します。これでAPI Keyを使ってAPIを叩けるようになりました。

APIを叩く

API Keyを使ってAPIを叩きましょう。簡単なサンプルショートカットを準備します。

Shortcutsでは一つの枠をアクションと呼びます。アクションごとに解説してゆきます。

変数 API_KEY を設定する

テキストに API_KEY を入力して、そのテキストにAPI_KEYという名前をつけて変数を設定します。これ以降、API_KEYという名前で変数を取得するといつでもテキストを使うことができます。アクションが増えるとわかりづらくなってくるため、こうやってわかりやすい名前をつけておきます。

テキスト(ショートカットの入力)

検索するためのテキストを ショートカットの入力 に設定します。ショートカットを別のアプリから呼び出したときは呼び出し元の入力を使い、呼び出さずにそのまま実行したときはテキストの入力ダイアログが表示されて自分で入力します。

Places API(New) を叩いて店舗情報を取得する

URLの内容を取得 を使います。

URL

Text Searchのエンドポイントを入力します。方法はPOSTを指定してください。

https://places.googleapis.com/v1/places:searchText
ヘッダ
キー
Content-Typeapplication/json
X-Goog-Api-Key変数:API_KEY
X-Goog-FieldMaskフィールドマスク

API_KEYは変数を指定します。また、フィールドマスクは取得したい情報を記入します。指定できる情報はいっぱいありますが、サンプルなので店舗名のみを指定します。

places.displayName
ボディ

本文を要求にJSONを指定します。

取得する結果の件数と、店舗を検索する範囲を自分中心に円形でしていします。

キー階層種類
maxResultCount1数字10検索結果のMax数。増やすほどAPIを使うための金額が増える。
textQuery1テキストテキスト検索したいテキスト

URL、ヘッダ、ボディを指定したら一度実行してみてください。テキストを元に検索した店舗を取得できます。いまの段階ではJSONと呼ばれる英数字を含む長い文字列が取得できます。読みづらいですが、付近の店舗名っぽいものが見えたら成功です。

{"places":[{"displayName":{"text":"店舗名1","languageCode":"ja"}},{"displayName":{"text":"店舗名2","languageCode":"ja"}},{"displayName":{"text":"店舗名3","languageCode":"ja"}},{"displayName":{"text":"店舗名4","languageCode":"ja"}},{"displayName":{"text":"店舗名5","languageCode":"ja"}},{"displayName":{"text":"店舗名6","languageCode":"ja"}},{"displayName":{"text":"店舗名7","languageCode":"ja"}},{"displayName":{"text":"店舗名8","languageCode":"ja"}},{"displayName":{"text":"店舗名9","languageCode":"ja"}},{"displayName":{"text":"店舗名10","languageCode":"ja"}}]}

場所情報を整理する

Notionには店舗の基本情報として、店舗名以外に住所、地図のURL、写真を保存します。先程のサンプルに増やす情報を追加し、店舗を選択してNotionに渡しやすいようにデータを整理します。

店舗情報で取得する値を追加する

より多くの店舗情報を取得するには、APIのヘッダー X-Goog-FieldMask にフィールドマスクを追加します。ここではフィールドマスクの内容をNotionプロパティに入れるために整理をします。お店の情報を取得した結果の辞書から取り出します。

  • places.shortFormattedAddress: 店舗の住所
  • places.displayName: 店舗の表示名
  • places.id: 店舗のID。GoogleMapのURLを作る時に使います。
  • places.photos: 店舗の写真

APIで取得したデータは、フィールドごとに取り出し方が違います。またNotionのプロパティへの保存もタイプごとに方法が違うため、非常に混乱しやすいです。間違えないようにタイプを表にまとめておきます。

フィールドマスク取り出し方Notionプロパティ名Notionプロパティタイプ
displayName二重の辞書Nametitle
shortFormattedAddress辞書住所rich_text
id辞書
URLに加工する
マップurl
photos二重の辞書
URLに加工する
自分でアイコンに保存する

URLの内容を取得の結果に辞書の値を取得を使います。フィールドマスクから共通の「places.」を取り除いたものをキーに指定します。APIの結果ごとのデータ構造は次のようになっています。

displayName

値が辞書になっているので、もう一度 text をキーとして辞書の値を取得します。

"displayName": {
  "text": "#{店舗名}",
  "languageCode": "ja"
}

shortFormattedAddress

値をそのまま使用できます。

"shortFormattedAddress": "#{店舗情報}"

id

値をそのまま使用できますが、GoogleMapで表示するためにはURLに加工する必要があります。

"id": "#{英数文字列}"

URLは次のように加工します。id でMAPを表示し、そこで displayName を検索した結果が表示されます。

https://www.google.com/maps/search/?api=1&query=displayName&query_place_id=id

photos

値はリストになっています。一店舗に何枚もの写真があるためです。あとで写真を選びたいため、画像を取得できるようにURLに加工したリストを作って保存します。nameをAPIに当てはめてURLを作ります。

"photos": [
  {
    "widthPx": 720,
    "heightPx": 720,
    "name": "places/#{英数文字列}/photos/#{英数文字列},
    "authorAttributions": [
      {
        "uri": "//maps.google.com/maps/contrib/#{数字}",
        "photoUri": "//lh3.googleusercontent.com/a/#{文字列}",
        "displayName": "#{表示名}"
      }
    ]
  }
]

写真を取得するにはAPI_KEYを使う必要があります。また画像サイズ

https://places.googleapis.com/v1/name/media?maxHeightPx=280&maxWidthPx=280&key=API_KEY

写真を取得するにはAPI_KEYを使う必要があります。また画像サイズはNotionのアイコンに合わせて280×280にしています。

店舗を選択するためのリストを作る

店舗の選択肢は、表示された店舗名を選択したら店舗情報を扱えるようにします。キーを店舗名、値を店舗情報の辞書 にした辞書を使ってリストから選択します。

選択画面のイメージ

場所リストの作り方

Places API(New) から取得した店舗情報はリストのため、辞書に直す必要があります。しかしShortcutsではリストから辞書への変換はできないため事前に空の辞書を作成して場所リストという生で変数を設定しておきます。必要な情報を店舗リスト内でまとめ、辞書 場所リストの値に設定します。

場所リストは店舗リストの中で上書きしないと繰り返し毎にリセットされてしまいます。店舗リストの繰り返しの中で店舗情報の辞書を作り、 場所リストで displayNameをキー、店舗情報の辞書を値に設定して辞書の値を設定します。これをもう一度 場所リスト という名前の変数に値を設定し、上書きます。こうすることで Places API(New) から取得した店舗情報 を辞書 場所リスト に入れることができます。

写真の扱い方

photos の中身は店舗ごとに数が違うリストになっています。これを店舗情報の辞書に追加するためには、最初から辞書に入れることはできません。辞書の中身には別で作っておいた辞書を含めることはできないからです。

次のような手順で辞書にリストを追加することができます。

  • リストを追加したい辞書を作る。キーがリストの名前、値が0件の配列を作っておく。
  • 辞書に追加したいリストを作る。
  • 辞書の値を設定 を使い、変数名に辞書、キーにリストの名前、値にリストを入れる。

ここではリストを準備しましたが、実際はphotosの中身を写真を取得するURLに変更したリストを作る必要があります。

photosは0件の場合もあります。はじめにphotosの件数を数え、0件の場合には何もしないようにします。

今回は店舗リストという辞書の中に、さらに辞書を作ってphotosのリストを追加するという入れ子の構造になっているためやや複雑ですが、上の作り方をベースにしています。

リストから選択に場所リスト指定します。

選んだ店舗をNotionに追加する

Notion APIを使うためには事前に準備が必要です。こちらで解説していますので、記事を読む前に準備をしておいてください。また店舗情報のデータベースをNotionに準備します。事前にサンプルデータベースを準備しています。テンプレートとして配布していますので、右上の複製ボタンを押して利用してください。複製後はご自身のdatabase_idを調べておいてください。

選択した店舗情報を辞書から取り出す

リストから選択した結果は辞書に入っています。Notionに登録するために、一つずつ 辞書の値を取得 します。

Notionページを追加する

お店情報のページを追加します。プロパティはName、住所、マップを追加します。

各部の説明

  • …APIのエンドポイントと方法です。Notionに対してどんな方法で操作を行うのかを指定します。ページを検索する時、方法はPOSTを指定してください。
  • …リクエストヘッダです。Notion APIにアクセスするための詳細情報を記載します。どの方法を使う場合もすべて同じことを書きます。
  • …リクエストボディです。方法でGETを選んだ場合は表示されません。具体的にNotionに追加する値を記載します。

properties

リクエストボディのpropertiesの中は、プロパティ名とプロパティタイプによって登録する内容が異なります。プロパティタイプごとに解説をします。

properties/title

該当するプロパティ

  • Name

properties/rich_text

該当するプロパティ

  • 住所

properties/url

該当するプロパティ

  • マップ

取得した URLの内容 は辞書になっています。追加したページを開くために、 辞書の値を取得 でURLを取得します。Notionアプリを開くために、https を notion に置き換えます。

選択した建物の写真を選択する

選択した店舗の 辞書の値を取得 でphotosを取得します。0件の場合は何もしないので、カウント で数を数えて if文 で分岐します。0より大きい場合のみ、photos の中身を繰り返します。

photos を保存する時、画像を取得するAPIに変更しています。そのため URLの内容を取得 すれば建物の画像を取得できます。入力から画像を取得 を使えば画像を取り出せるので、検索した店舗の画像リストが作られます。

リストから選択 を使えば画像リストから画像を選択できるようになります。Notion APIは画像を扱えないので、保存しておいた画像を自分でNotionに保存します。選択した ファイルを保存 します。保存先を尋ねるのチェックをONにしておくと、画像を選択したあとに保存先を尋ねられます。

最後にNotion APIのレスポンスに含まれていた URLを開 きます。最初の https を notion に置き換えておくと notion アプリでページを開くことができます。

おわりに

作ったShortcutsを実行すると、検索した店舗のリストが選択肢として表示されます。登録したい建物を選択すると建物情報がNotionに追加されて画像が何枚か表示されます。画像を選ぶとファイルとして保存され、追加されたNotionページが開きます。保存した画像ファイルをアイコンやページ内に保存すれば完成です。

登録したらお店に対する自分の評価や感想を自由に書き込めば自分だけのお店リストができあがるので、お店を探したいときはここを見れば良くなります。行きたいお店をNotionに登録するときに便利です。サンプルはこちらにありますので、試してみてください。

また、お店に行った時に周辺の店舗を登録するためのショートカットもご紹介していますので、合わせて見てみてください。

お店リストの使い方の他にもNotionを使った暮らしに役立つライフハックが紹介されています。

Notionライフハック 暮らしに役立つ36のアイデアとテンプレート
Amazon.co.jp: Notionライフハック 暮らしに役立つ36のアイデアとテンプレート eBook : Rei: Kindleストア

コメント

タイトルとURLをコピーしました