javascript - axios 授权 header 仅适用于获取请求

Question

我有一个简单的 api 端点用于分享帖子 /api/v1/posts/{id}/share，它需要使用不记名 token 进行身份验证。

我尝试发送如下的 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 中第二个参数表示“config”。 get，但代表 axios.post 中的“数据”。这就是它在 GET 中有效但在 POST 中失败的原因。

根据axios document ，这两种语法是:

axios.get(url[, config])

axios.post(url[, data[, config]])

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

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

请求已发送，HTTP body 为 {"header":{...}} -- 没有配置请求 header 。

要使其与 axios.post 一起使用，headers 配置对象应作为第三个参数传递。如:

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