axios授权标头仅适用于get请求

Question

我有一个简单的api端点，用于共享需要使用承载令牌进行身份验证的帖子/api/v1/posts/{id}/share 。

我尝试发送如下所示的POST请求，并且响应为401

axios.post(`/api/v1/posts/${id}/share`,
        {
        "headers": {
                "Authorization":"Bearer "+token,
                "Content-Type": "application/x-www-form-urlencoded",
                "Accept": "application/json"
            },
        });

只有当我将其更改为在后端接受GET并将代码更改为此时，它才起作用

axios.get(`/api/v1/posts/${id}/share`,
        {
        "headers": {
                "Authorization":"Bearer "+token,
                "Content-Type": "application/x-www-form-urlencoded",
                "Accept": "application/json"
            },
        });

我使用http客户端（失眠）测试了端点，因此问题似乎出在axios上。 为什么会发生这种情况，我该如何解决？

我正在使用的服务器是apache，后端框架是laravel

Answer 1

这个问题的根本原因是： axios.post和axios.get具有不同的语法-所述第二参数表示在“配置” axios.get ，但在表示“数据” axios.post 。 这就是为什么它在GET中起作用但在POST中失败的原因。

根据axios 文档 ，这两种语法是：

axios.get（URL [，config]）

axios.post（URL [，data [，config]]）

因此，当您发送带有代码的HTTP POST请求时：

axios.post(`/api/v1/posts/${id}/share`,
        {
        "headers": {
                ...
            },
        });

发送请求，HTTP 正文为{"header":{...}} -未配置请求标头。

为了使其与axios.post一起axios.post ，应将headers配置对象作为第3个参数传递。 如：

axios.post(`/api/v1/posts/${id}/share`,
        {}, // or whatever data you want to send.
        {
        "headers": {
                ...
            },
        });

Answer 2

所以我通过使用不同的语法解决了这个问题

const options = {
        method:"post",
        "headers": {
            "Authorization":token,
            "Content-Type": 'application/x-www-form-urlencoded',
            "Accept": "application/json"
        },
        url:`/api/v1/posts/${id}/share`
    };

    axios(options);

老实说，我不能说改变了什么，但是在这里您可以找到任何看到这一点的人。