# APIのリクエストに複雑なデータを入れる

Dashcombがサポートしている[UI Component](/dashcomb-help-center/ide/ui-component.md)とREST APIを利用して、APIのリクエストに複雑なデータを設定することができます。

## 準備

* このAPIの連携先になる管理画面を作成しておきます。

## 実現

<figure><img src="/files/sEhCA3IVPnDe971zyK73" alt=""><figcaption></figcaption></figure>

* [REST APIへの接続設定](https://docs.dashcomb.com/dashcomb-help-center/tips-and-tricks/pages/urC7HTEGAqXWjHZCvmFx#rest-apiへの接続設定-rest-api)画面でAPI設定します。
* 「エンドポイント」に `https://httpbin.org` を入力します。
* 「保存」ボタンを押すと、API接続の作成ができました。
* サブドメイン検証用に管理画面へ[Input](/dashcomb-help-center/ide/ui-component/input.md)をドラッグ＆ドロップします。
  * 例えば、オブジェクト名は `input1` とします。
* メールアカウント検証用に管理画面へ[Input](/dashcomb-help-center/ide/ui-component/input.md)をドラッグ＆ドロップします。
  * 例えば、オブジェクト名は `input2` とします。
* 管理画面の[クエリ領域](/dashcomb-help-center/ide/query-region.md)で「API」タブをクリックします。
* 「+」アイコンを押して、API名を作成します。
* データソースリストから先ほど作成したREST APIを選びます。
* 「実行前アクション」に「アクション無し」、「確認」、「承認」を選べることができます。
  * ここでは初期の「アクション無し」を選びます。
* 続いては「POST」を選びます。
* 「Bodies Type」に「x-www-urlencoded」を選びます。
* パラメータに `query` と `mutation {activate(input: {subdomain: "{{input1.value}}"email: "{{input2.value}}"})}` を入力します。
  * APIのリクエストにこういう多重なJSONなどの複雑なデータを入れることも可能です。
* 「成功時」、「失敗時」の「アクション」や「通知」を設定します。
  * 設定方法の詳細は[アクションエディタ](/dashcomb-help-center/ide/property-region/action-editor.md)にご参考ください。
  * ここでは全て初期の「アクション無し」を選びます。
* 「保存」ボタンを押すと、完了です。

## 参照項目

* [API接続](/dashcomb-help-center/ide/others/dtassu/api.md)
* [API経由のCRUD操作](/dashcomb-help-center/tips-and-tricks/api-crud.md)
* [Inputの使い方](/dashcomb-help-center/ide/ui-component/input.md)
* [アクションエディタ](/dashcomb-help-center/ide/property-region/action-editor.md)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.dashcomb.com/dashcomb-help-center/tips-and-tricks/add-complicated-data-to-api-request.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.