jquery.mockAjax でサーバ待ちしないさくさく開発を

ディノ日本酒調達部員の sou です。こんにちは。 今日はAjax開発に便利なjQueryプラグインを紹介します。

ディノも昨年から JavaScript 案件が増えており、本格的な JavaScript アプリケーションも実装するようになってきました。ただ、サーバサイドのみの開発に比べるとXMLHttpRequest経由でサーバサイドとのつなぎ込みが発生するので、問題の切り分けや実装スケジュール調整など難しい点もあるのではないでしょうか。

そんな時には jquery.mockAjax プラグインが便利です。

概要

これを使うと $.ajax のリクエスト先を条件に従い振り分ける事が出来、スクリプトや HTML の書き換え無しにサーバ側への通信をカットし、
ローカルファイルで用意した JSON や HTML フラグメントを代わりに持ってくる事が出来ます。

小さい&単純なコードですが、これでサーバ側の実装に依存せずクライアント開発をさくさく進める事が出来ます。

また、クライアントとサーバ側の開発担当を分けるような場面でも、クライアント側が期待するレスポンスを具体的な JSON として示すことが出来るので話が早く進んだり、
開発中のサーバに接続出来ない環境でのデモを見せる際など、方々に活躍、、していた気がします!

使い方

使い方は簡単、

$.mockAjax(
  {
    cond: /\/search\?.*q=no_result/,
    method: 'get',
    url: '/pseudo_data/search_response_no_result.json'
  },
  {
    cond: '/map/search?q',
    method: 'get',
    url: '/pseudo_data/search_response.json'
  }
);

のように引数の JSON で設定を与えます。
リクエスト先 URL が cond の正規表現と method にマッチした場合、url に置き換えられます。
検索語句によってレスポンスを変えたい!と言った場合にも、上記のようにして対応しています。

興味を持たれた方は是非一度お試しください。 「他にこんなやり方もあるぜ!」といったツッコミ、情報もお待ちしております。

株式会社ディノではエンジニアを絶賛募集中です。

コメント / トラックバックはありません

コメントする