ホームメンバー問い合わせ

【ノーコード入門】Makeでなんとかやってみる(4):MakeからAPIを呼び出す

By monco
Published in 博士の視点
November 04, 2023
【ノーコード入門】Makeでなんとかやってみる(4):MakeからAPIを呼び出す

前回のあらすじ

前回は中小企業庁が提供する「官公需情報ポータルサイト」が提供するAPI「官公需情報ポータルサイト検索API(以下、官公需APIとします)」について解説しました。 今回はこのAPIに対してMakeからアクセスしてみます。

MakeからAPIを呼び出す

このAPIについて、前回わかったことをまとめます。

上の情報を参照しながら、いよいよMakeによるAPI連携アプリの作成です。Makeにログインして、右上の「Create a new scenario」をクリックするとスタートです!

最初の一歩
最初の一歩
最初はこの画面になります。この画面にブロックを配置し、連結していくことでアプリを作っていくことになります。
アプリ作成画面
アプリ作成画面
画面中央の「+」をクリックするとブロックの一覧が出てきます。虫眼鏡マークのところに「http」と入力すると、地球儀のアイコンが出てきますのでそれをクリックします。
利用するブロックの選択
利用するブロックの選択
地球儀をクリックすると、さらに地球儀がたくさん並びます。それぞれ、違う機能を提供していますが、今回は「Make a request」を選びます。APIにリクエストする機能を持つものです。
Make a requestをクリック
Make a requestをクリック
クリック後の画面
クリック後の画面
この「HTTP-Make a request」というのが、APIにアクセスできるブロックです。ここに、APIのデータを入力していきます。先程のAPIの情報をおさらいしておきます。

まずはURLの部分に

と、さらにMethodの部分に

  • パラメータ送信方式 POST

    を選んでおきます。

    入力するとこんな感じ
    入力するとこんな感じ
    Headersには、「Add a header」をクリックし、Item 1のNameに content-type 、Valueに application/xml を入力します。これはおまじないのようなものなので、そのまま入力しておきましょう。
    Headerの指定
    Headerの指定
    あとはパラメータですが、今回は北海道の除雪を想定してみましょう。

  • パラメータ:

    • Query: 除雪
    • LG_Code: 01 (北海道)
    • CFT_Issue_Date: 2023-01-01/ (登録日が2023/1/1以降)

これを入力していきます。「Query String」に入力します。「Add parameter」を押して、「Name」にコロン(:)の左部分、「Value」にコロンの右部分を入れていきます。

パラメータ入力前
パラメータ入力前
パラメータはこのように記載します
パラメータはこのように記載します
これで、APIにアクセスする準備はできました。一番下の「OK」を押して…
OKを押す
OKを押す
CONTROLSのファイルボタンをクリックして、いったん保存したあと、「Run once」を押します。そうすると、今あるブロックが実行されます。
Run onceを押す
Run onceを押す
設定が誤ってなければ、HTTPのアイコンの上に吹き出しが現れ、「1」と表示されます。

APIで取得したデータを確認しよう

実行結果
実行結果
この「1」をクリックすると、APIにアクセスした結果が見られます。INPUTがAPIに送ったデータ、OUTPUTがAPIから戻ってきたデータです。
実行結果の詳細
実行結果の詳細
INPUTのQueryに設定したデータが入っています。
INPUTの内容
INPUTの内容
OUTPUTについては、Status codeが「200」となっていると、成功していると思います。「404」など、他の数字になっている場合は、データは送信できているけど、外部サービスの処理に失敗しているを示しますので、設定したパラメータに余計な半角スペースが入っていたり、全角で入力していたりしていないか確認して、再度実行します。

実際の検索結果はOUTPUTのDataに入っています。

OUTPUTの内容
OUTPUTの内容
なんだかよくわかりませんが、それっぽいデータが入っていることがわかります。これをわかりやすくするには、HTTPブロックの設定の「Parse response」を Yes にします。これは、このDataを整形して、人間でもわかりやすくするオプションです。
Parse responseをYesにする
Parse responseをYesにする
これを設定したら、再度「Run once」して、結果を見てみます。Dataの下のSearchResultが10個あることがわかります。
+を押しながら展開していきます
+を押しながら展開していきます
さらに数字の左の「+」を押すと、それぞれの検索結果の詳細がわかります。
検索結果の詳細
検索結果の詳細

よく見ると ProjectName だったり、 ProjectDescription だったりと、それぞれの支援制度の詳細が入っていることがわかります。

今回は、APIからデータを取得するところまでを確認しました。次回はこの内容をGoogle Spreadsheetに書き込んでいきます。

これにてご免!


Tags

ノーコード中小企業スタートアップMakeAPIテクノロジー解説

Share

Previous Article
【AWSでキメる】 サムライアプスのサーバーレスウェブサイト制作術(1)
monco

monco

デジタル化 サムライ

Table Of Contents

1
前回のあらすじ
2
MakeからAPIを呼び出す
3
APIで取得したデータを確認しよう

Related Posts

【ノーコード入門】Makeでなんとかやってみる(最終号=5):APIで取得したデータをGoogle Spreadsheetに書き込む
November 05, 2023
© 2024, All Rights Reserved.
Powered By

コンテンツ

補助金・政策博士の視点アイデアの小槌

Social Media