代码之家  ›  专栏  ›  技术社区  ›  Matthew

为什么d3.json不发送带有请求的cookies?

  •  1
  • Matthew  · 技术社区  · 7 年前

    我对使用d3.js(v5)中的内置方法执行ajax请求很陌生。这是我的代码:

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

    我在一个使用cookie身份验证的应用程序中尝试了这个方法,并一直获得401个状态码。使用chrome开发工具发现它发送请求时根本没有任何cookies。

    这很奇怪,因为本地javascript中的ajax请求在默认情况下会随每个请求一起发送cookies。以下是本机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的示例?我一直使用本地ajax,因为我不使用jquery,但是如果它是我使用的库的一部分,我想学习如何使用它。但是 documentation 几乎什么都没说, page it links to 也没用。而且大多数教程都是针对以前版本的d3的,现在已经不起作用了。
    1 回复  |  直到 7 年前
        1
  •  2
  •   mostlyoxygen    7 年前

    版本5切换到使用fetch api,默认情况下它不发送任何cookies。您可以通过添加d3.json传递到fetch的选项来克服这个问题:

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

    或者,对于跨来源请求:

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

    如果返回4xx状态(或5xx),d3将导致承诺被拒绝,您可以通过提供第二个回调函数来处理 then . 我欢迎更正,但我相信在这个函数中无法获得实际的状态代码。

    我在文档中(在编写本文时)唯一提到的fetch和promises的更改是在changelog中: D3 v5 Changes .