概要

Ruby on Railsフレームワークの便利なライブラリである@rails/ujsには、Ajaxリクエストを簡単に行うためのajaxメソッドがあります。
しかし、最近ではPromiseベースの処理がより一般的になってきました。

そこで、今回はajaxメソッドをPromise化するための拡張を行う方法を紹介します。
これにより、コールバックベースの処理から解放され、よりシンプルで分かりやすいコードを書くことができます。

方法

元のパッケージにあるajaxメソッドをラップしたajaxAsyncメソッドを追加します。

// rails-ujs.js
import Rails from "@rails/ujs";

Rails.ajaxAsync = (options) => {
  return new Promise((resolve, reject) => {
    Rails.ajax({
      ...options,
      success: (response) => resolve(response),
      error: (response) => reject(response),
    });
  });
};

export default Rails;

これにより、ajaxAsyncメソッドを使用することで、より柔軟でスマートな非同期処理を実現できます。
Promiseを利用することで、エラーハンドリングもより効果的に行えるので、コードの信頼性が向上します。

import Rails from "./rails-ujs";

// ajaxAsyncメソッドを使用してAjaxリクエストを行う例
Rails.ajaxAsync({ type: "GET", url: "http://localhost:3000/users" })
  .then((resp) => console.log(resp))
  .catch((error) => console.error("エラーが発生しました:", error));