javascript - 我应该在 sinon.js 中模拟 cors OPTIONS 请求还是如何测试跨域 ajax 请求？

Question

我正在为我正在处理的 javascript/jquery 库创建单元测试。我需要发出大量跨域 Ajax 请求，并试图通过 Sinon.js 来解决问题尝试模拟以下场景:

• 我向 x-domain-abc.com/somestorage 发出 AJAX“PUT”跨域请求
• 我包括用于身份验证的自定义 header
• 这将触发预检 OPTIONS 请求
• 请求应该被 fakeServer 捕获并用一些自定义 header 响应(我希望我的提供商添加的 header ;-)
• 之后实际的“PUT”完成，也被 fakeServer 捕获并做出相应的响应。

我的请求是这样的:

$.ajax({
  url: url + '?_=' + Date.now(),
  type: 'PUT',
  data: document,
  async: true,
  crossdomain: true,
  headers : {
  Authorization: 'Basic ' + Base64.encode(
    priv.user + ':' + priv.pass
    )
  },
  success: function () {
      // do sth
  },
  error: function () {
      // do sth else
  }
});

在我的测试模块中，我目前正在这样做:

test ("Put", function(){
  var o = generateTools(this);
  // lib invocation
  o.jio = JIO.newJio({
    "type": "dav",
    "username": "davput",
    "password": "checkpwd",
    "url": "https://ca-davstorage:8080"
  });

  // put non empty document
  o.addFakeServerResponse("PUT", "put1", 201, "HTML RESPONSE");
  o.spy (o, "value", {"ok": true, "id": "put1"},
         "Create = PUT non empty document");
  // the JSON "document" that should be stored
  o.jio.put({"_id": "put1", "title": "myPut1"}, o.f);
  o.clock.tick(5000);
  o.server.respond();
  o.jio.stop();
});

O 包括:

generateTools = function (sinon) {
  var o = {};
  o.t = sinon;
  o.server = o.t.sandbox.useFakeServer();
  o.clock = o.t.sandbox.useFakeTimers();
  o.clock.tick(base_tick);
  o.spy = basicSpyFunction;
  o.tick = basicTickFunction;
  ...
  o.addFakeServerResponse = function (method, path, status, response) {
    var url = new RegExp('https:\\/\\/ca-davstorage:8080\\/' + path +
                    '(\\?.*|$)');
    o.server.respondWith(method, url,
      [status, { "Content-Type": 'application/xml' }, response]
    );
  }
  return o;
},

问题:
测试 OPTIONS/preflight 是否有意义，因为它是由浏览器内部处理的，我无法访问或影响？

如果不是，我应该针对 CORS 请求测试什么？

Answer 1

由于您的单元测试正在运行您的 JavaScript 代码，因此您不需要测试 CORS 预检响应。正如您提到的，预检的细节由浏览器在幕后处理。所以没有代码来测试处理预检。

您真的不需要进行任何 CORS 特定测试，因为浏览器会为您处理所有这些细节。从 JavaScript 的 Angular 来看，CORS 请求看起来就像常规的 XmlHttpRequest。你的假服务器应该只返回一个预期的响应，你的单元测试应该检查你的代码是否正确处理了这个响应。

现在，如果您控制着服务器，那么测试 CORS 预检响应就很重要了。如果您真的想要完整，您可以设置测试以向您的提供商发出预检和常规 CORS 请求。然而，这超出了简单单元测试的范围，因为它会向远程服务器发出实时请求。