DataAPI SDK japanese MT.DataAPI Endpoint methods overview

概要 - エンドポイントにアクセスするメソッド

メソッドパラメータ

エンドポイントの定義の中の route 要素 (例えば /:site_id/entries) に含まれる、:site_id のような部分をメソッドパラメータと呼びます。

エンドポイントにアクセスするメソッドに関しては、以下のように様々な形式でこのメソッドパラメータを指定することができます。

数値

var siteId = 1;
api.listEntries(siteId, function(response) {
  // レスポンスデータを使った処理
});

Object

var site = {
  id: 1
};
api.listEntries(site, function(response) {
  // レスポンスデータを使った処理
});

関数

var siteId = function() { return 1 };
api.listEntries(siteId, function(response) {
  // レスポンスデータを使った処理
});

idプロパティが関数であるObject

var site = {
  id: function() { return 1 }
};
api.listEntries(site, function(response) {
  // レスポンスデータを使った処理
});

クエリパラメータとリクエストボディ

クエリパラメータやリクエストボディは以下のように様々な形式で指定することができます。

文字列

var query = 'search=QUERY';
api.listEntries(site, query, function(response) {
  // レスポンスデータを使った処理
});

Object

var query = {
  search: 'QUERY'
};
api.listEntries(site, query, function(response) {
  // レスポンスデータを使った処理
});

HTMLFormElementオブジェクト

<form id="search-form">
  <input type="text" name="search" />
</form>
<script type="text/javascript">
var query = document.getElementById('search-form');
api.listEntries(site, query, function(response) {
  // レスポンスデータを使った処理
});
</script>

FormDataオブジェクト

// This code requires that your browser had implemented FormData.
var query = new FormData();
query.append('search', 'query');
api.listEntries(site, query, function(response) {
  // レスポンスデータを使った処理
});

リクエストボディで指定するリソース

新規作成時やアップデート時に指定するリソースは、以下のように様々な形式で指定することができます。

Object

// データの内容は正確である必要はなく、必要なデータのみが入ったObjectを渡すことができます。
// また不必要なデータが入っていても問題はありません。
var data = {
  title: 'TITLE',
  body: 'BODY'
};
api.updateEntry(site, entryId, data, function(response) {
  // レスポンスデータを使った処理
});

APIから取得したデータをそのまま渡すこともできます。

api.getEntry(site, entryId, function(entry) {
  entry.title = 'UPDATED TITLE';
  api.updateEntry(site, entryId, entry, function(response) {
    // レスポンスデータを使った処理
  });
});

HTMLFormElementオブジェクト

<form id="entry-form">
  <input type="text" name="title" />
  <textarea name="body" />
</form>
<script type="text/javascript">
var data = document.getElementById('entry-form');
api.createEntry(site, data, function(response) {
  // レスポンスデータを使った処理
});
</script>

ファイルの送信

ファイルに関してもいくつかの方法で指定することができます。

ただどの方法を利用する場合においても、ファイルの指定に関しては一つ注意の必要な点があります。それは、IEではJavaScriptでファイル選択ダイアログを開いた場合に、セキュリティ上の制限からJavaScriptでファイルを送信することができなくなるという点です。

例えば以下のコードで送信しようとした場合、IEではセキュリティエラーが発生します。

<form>
  <input type="file" name="file" id="file" />
</form>
<a href="#" id="select-file">Select file</a>
<script type="text/javascript">
document.getElementById("select-file").onclick = function() {
  getElementById("file").click();
  return false;
};

var data = {
  file: getElementById("file").files[0],
};
api.uploadAsset(siteId, data, function(response) {
  if (response.error) {
    // エラー処理
    return;
  }

  // レスポンスデータを使った処理
});
</script>

このケースでは、以下のようにLABEL要素を使って書き換えることでこの制限を回避することができます。

<form>
  <input type="file" name="file" id="file" />
</form>
<label for="file">Select file</label>
<script type="text/javascript">
var data = {
  file: getElementById("file").files[0],
};
api.uploadAsset(siteId, data, function(response) {
  if (response.error) {
    // エラー処理
    return;
  }

  // レスポンスデータを使った処理
});
</script>

以下、ファイルの指定方法の説明になります

Fileオブジェクト

var data = {
  file: getElementById('file-input').files[0]
};
api.uploadAsset(siteId, data, function(response) {
  // レスポンスデータを使った処理
});

HTMLInputElementオブジェクト

var data = {
  file: getElementById('file-input')
};
api.uploadAsset(siteId, data, function(response) {
  // レスポンスデータを使った処理
});

HTMLFormElementオブジェクト

<form id="asset-form">
  <input type="file" name="file" />
</form>
<script type="text/javascript">
var data = document.getElementById('asset-form');
api.uploadAsset(siteId, data, function(response) {
  // レスポンスデータを使った処理
});
</script>

レスポンスデータ

成功時

api.createEntry(site, data, function(response) {
  console.log(response); // アンシリアライズされたレスポンスデータ
});

エラー発生時

api.createEntry(site, data, function(response) {
  if (response.error) {
    console.log(response.error.code);    // HTTPレスポンスコード
    console.log(response.error.message); // エラーメッセージ
    console.log(response.error.data);    // 現在のエラーが追加のデータを持っている場合
  }
});