FakeServerで一部だけ実際のサーバにリクエストさせる #JavaScript

Sinon.JSのFakeServerでXHRをフェイクするけど、特定のXHRだけは実際にリクエストさせるときのメモ。

最初にFakeServerを作る。

var server = sinon.fakeServer.create();

この時点でXMLHttpRequestがSinonのものに置き換わっているようなので、戻したいときはserver.restore()で。

autoRespondをtrueにして、FakeServerにリクエストを投げたときにわざわざserver.respond()しなくていいようにする。

server.autoRespond = true;

ここが一番大事なところ、フィルタの指定。

server.xhr.useFilters = true;
server.xhr.addFilter(function(method, url, async, username, password) {
  if (url.indexOf('/path/to/api') !== -1) {
    // フェイクしない
    return true;
  }

  // フェイクする
  return false;
});

server.xhr.useFilters = trueでフィルタを使用する指定をする。

server.xhr.addFilterにフィルタ用の関数を渡す。

addFilter()はリクエストするたびに呼ばれる。渡す関数は戻り値としてtrueを返すとFakeServerで処理せずに実際にリクエストを投げ、falseを返すとFakeServerで処理されるようになる。

上記のコードの場合、リクエスト先のURLに/path/to/apiが含まれていれば実際にリクエストを投げた上でそのレスポンスが返るが、それ以外の場合はFakeServerに処理される。

JSONファイルは実際にリクエストして取得して、APIはFakeServerのレスポンスを受け取りたい、という謎の使い方をしたくて調べたら簡単にできた。Sinonすごい。