javascript - 为什么 d3.json 不随请求发送 cookie？

Question

我不熟悉使用 d3.js (v5) 中的内置方法执行 ajax 请求。这是我的代码:

d3.json(uri).then(data =>console.log(data));

我在一个使用 cookie 身份验证的应用程序中尝试了这个，并不断收到 401 状态代码。使用 chrome 开发工具显示它发送的请求根本没有任何 cookie。

这很奇怪，因为默认情况下， native javascript 中的 ajax 请求会随每个请求一起发送 cookie。下面是 native javascript 中的 ajax 请求示例:

function nativeAjax(uri, callback) {
    let request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState === 4) {
            callback(request);
        }
    }
    request.open('get', uri, true);
    request.send(null);
}
nativeAjax(uri, request => console.log(request.status));

将其插入我的应用程序，chrome 开发工具显示它确实随请求发送了身份验证 cookie，实际上 request.status 返回为 200 表明它确实通过了身份验证。

我的问题是:

1. 如何配置 d3.json 以发送所需的 cookie？
2. 如何按状态捕捉响应？例如，我想对 401 响应和 403 响应做一些不同的事情。
3. 我在哪里可以阅读有关如何使用 d3.json 的更完整的文档或示例？我一直使用 native ajax，因为我不使用 jquery，但如果它是我正在使用的库的一部分，我想学习如何使用它。但是 documentation几乎什么也没说，page it links to也没有帮助。大多数教程适用于以前版本的 d3，不再适用。

Answer 1

版本 5 切换为使用 Fetch API，默认情况下不发送任何 cookie。您可以通过为 d3.json 添加选项以传递给获取来克服这个问题:

d3.json(uri, {credentials: "same-origin"}).then(...);

或者，对于跨源请求:

d3.json(uri, {credentials: "include"}).then(...);

如果返回 4XX 状态(或 5XX)，D3 将导致 promise 被拒绝，您可以通过向 then 提供第二个回调函数来处理这种情况。我欢迎更正，但我相信在此函数中无法获取实际状态代码。

我在文档(撰写本文时)中发现的对 Fetch 和 promises 的更改的唯一提及是在更改日志中:D3 v5 Changes .