非同期処理(async/await)

kintone の JavaScript カスタマイズで、kintone.events.on に登録するイベントハンドラーを async/await で書く方法と、実装する上での注意点を紹介します。

API の呼び出しなど、完了を待ってからレコードの値を書き換えたい場合に利用します。

実装方法

// 重たい処理
const heavyProcess = () => {
  return new Promise((resolve) => setTimeout(() => resolve('1秒かかる処理が完了しました'), 1000));
};

// 無名関数で実装
kintone.events.on(['app.record.index.show'], async (event) => {
  const result = await heavyProcess();
  console.log(result);
  return event;
});

// 関数を用意したうえで実装
async function handler(event) {
  const result = await heavyProcess();
  console.log(result);
  return event;
}

kintone.events.on(['app.record.create.show'], handler);

注意点

kintone.events.on に登録した関数は、引数として受け取った event を最終的に return します。

kintone.events.on(['app.record.print.show'], (event) => {
  // 借りたらちゃんと返す
  return event;
});

この関数を async にするということは、返却される値が event から Promise<event> になるということです。

kintone.events.on(['app.record.print.show'], async (event) => {
  // 返却されるのはeventそのものではなく、Promiseにラップされたオブジェクト
  return event;
});

kintone はこれを想定していて、cybozu developer network の各イベントのページに以下のような記述があります。

kintone.Promise オブジェクトを return すると、非同期処理の完了を待って次の処理を開始します。

ただし、イベントによっては Promise に対応していないものがあります。投稿時点（2021 年）では app.record.create.show、app.record.edit.show、app.record.detail.show は動作が保証されておらず、app.record.edit.change や app.record.create.change ではエラーになることを確認していました。

対応状況は kintone のアップデートで変わる可能性があるため、利用するイベントごとに最新の公式ドキュメントで「Promise に対応しているか」を確認してください。