azure app service で kintone アプリデータ公開その４です。
ブラウザー上で、REST API を呼び出すための JS API を作成します。
概要
JavaScript で、REST API を呼び出すには、xmlhttprequest などを使えば可能ですが、いちいち手順を踏むのは面倒です。
簡単に REST API を呼び出す JS API を作ってみます。
kintone.api のようなものです。
参考情報
REST API を呼び出すには、axios が便利そうです。
kintone-js-sdk でも、axios を使っていましたので、axios を利用します。
作成する JS API
- kbrowser.api
処理内容は、kintone.api と同様です。
rex0220-kbrowser.js の追加
ブラウザー上で実行しますので、リンクで参照できるように /public/rex0220-kbrowser.js に追加します。
とりあえず作成するのは 'GET' 処理だけで、他は未実装です。
axios は、Promise 対応しているので、記述がわかりやすいですね。
callback, errback は、未実装です。いるかな？
kbrowser は、グローバル変数に設定して、各JSから直接利用できるようにします。
rex0220-kbrowser.js
(function () {
'use strict';
window.kbrowser = {};
var kbrowser = window.kbrowser;
kbrowser.api = function(req, method, body) {
var resp = {};
switch(method) {
case 'GET':
return axios.get(req, { params: body })
.then(function (response) {
// console.log(response);
resp = response.data;
})
.catch(function (error) {
console.log(error);
resp.error = error;
})
.then(function () {
// always executed
return resp;
});
case 'POST':
case 'PUT':
case 'DELETE':
break;
default:
break;
}
return resp;
};
})();
rex0220-kbrowser.js の使い方
kintone.api と同様ですね。
sample.js
var parm = {
app: 549,
query: 'order by $id'
};
kbrowser.api('/api/v1/list', 'GET', parm).then(function(resp) {
console.log('list api', resp);
});
次にやること
あとがき
これでクライアント上から kintone アプリレコードを取得できる準備ができました。
次はグリッドライブラリを使った、レコード表示をしてみます。