REST APIエンドポイントの作成

ここからは、Hasuraを使ってREST APIエンドポイントを作成し、実際にWebアプリケーションから利用する方法を説明します。

設計

HasuraはGraphQL APIサーバーとして利用するだけでなく、REST APIサーバーとして利用することもできます。このハンズオンでは、GraphQL QueryをREST化し、次の仕様のREST APIエンドポイントを作成します。

名称HTTPメソッドとパス説明
ページの取得GET /api/rest/page/:id割り当てられた識別子 id をもつページを取得します。ページが存在する場合、レスポンスボディには data.page.content プロパティを含みます。
ページの更新PUT /api/rest/page/:id割り当てられた識別子 id をもつページを更新します。リクエストボディには content プロパティを与えます。

「ページの取得 (GET page/:id)」エンドポイントの作成

ページを取得するためのREST APIエンドポイントを作成します。

コンソールのトップ画面のGraphiQLのパネルにアクセスし、次のコードを書きます。

query getPage($id: Int!) {
  page: pages_by_pk(id: $id) {
    id
    content
  }
}

[REST]ボタンを選択し、REST APIエンドポイント作成フォームを表示します。次の必要事項を入力し、作成ボタンを選択しエンドポイントを作成します。

項目説明内容
Nameエンドポイントの名称get page
URL Path/api/rest/ 以降のパスpage/:id
MethodHTTPメソッドGET

「ページの更新 (PUT page/:id)」エンドポイントの作成

ページを更新するためのREST APIエンドポイントを作成します。

コンソールのトップ画面のGraphiQLのパネルにアクセスし、次のコードを書きます。

mutation putPage($id: Int!, $content: jsonb!) {
  page: insert_pages_one(
    object: { id: $id, content: $content }
    on_conflict: { constraint: pages_pkey, update_columns: content }
  ) {
    id
    content
  }
}

[REST]ボタンを選択し、REST APIエンドポイント作成フォームを表示します。次の必要事項を入力し、作成ボタンを選択しエンドポイントを作成します。

項目説明内容
Nameエンドポイントの名称put page
URL Path/api/rest/ 以降のパスpage/:id
MethodHTTPメソッドPUT

作成が完了すると作成したREST APIエンドポイントの一覧が表示されます。