我在ReactJS中编程时使用Axios,我假装向服务器发送DELETE请求。

要做到这一点,我需要头文件:

headers: {
  'Authorization': ...
}

而身体是由

var payload = {
    "username": ..
}

我一直在网上搜索,只发现DELETE方法需要一个“参数”,不接受“数据”。

我一直想这样发送

axios.delete(URL, payload, header);

甚至

axios.delete(URL, {params: payload}, header);

但似乎什么都不管用……

有人能告诉我,如果这是可能的(我假设是)发送一个删除请求与头部和主体,以及如何这样做?


当前回答

与axios无关,但可能帮助人们解决他们正在寻找的问题。PHP在执行delete调用时不解析post数据。Axios delete可以发送带有请求的主体内容。 例子:

//post example
let url = 'http://local.test/test/test.php';
let formData = new FormData();
formData.append('asdf', 'asdf');
formData.append('test', 'test');

axios({
    url: url,
    method: 'post',
    data: formData,
}).then(function (response) {
    console.log(response);
})

result: $_POST Array
(
    [asdf] => asdf
    [test] => test
)


// delete example
axios({
    url: url,
    method: 'delete',
    data: formData,
}).then(function (response) {
    console.log(response);
})

result: $_POST Array
(        
)

要在PHP中获得删除调用的post数据,请使用:

file_get_contents('php://input'); 

其他回答

实际上,axios.delete支持请求体。 它接受两个参数:一个URL和一个可选配置。这是……

axios.delete(url: string, config?: AxiosRequestConfig | undefined)

您可以通过以下方法设置删除请求的响应体:

let config = { 
    headers: {
        Authorization: authToken
    },
    data: { //! Take note of the `data` keyword. This is the request body.
        key: value,
        ... //! more `key: value` pairs as desired.
    } 
}

axios.delete(url, config)

我希望这能帮助到一些人!

delete同时支持请求正文和请求头。

它接受两个参数:url和可选配置。您可以使用配置。设置请求正文和请求头的数据如下:

axios.delete(url, { data: { foo: "bar" }, headers: { "Authorization": "***" } });

请看这里- https://github.com/axios/axios/issues/897

对于Axios DELETE Request,您需要在一个JSON对象下包含请求有效负载和头部:

axios.delete(URL, {
  headers: {
    'Authorization': ...
  }, 
  data: {
    "username": ...
  }
})

为什么我不能这样做,因为我做类似的POST请求?

查看Axios文档,我们看到.get、.post…有不同的签名:

axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])

注意只有post, patch和put有data参数。这是因为这些方法通常包含一个主体。

查看RFC7231,我们看到DELETE请求不需要有body;如果您包含一个主体,那么它的含义在规范中没有定义,服务器也不需要理解它。

DELETE请求消息中的有效负载没有定义的语义;在DELETE请求上发送有效负载主体可能会导致某些现有实现拒绝该请求。

(此处第5段)。

在这种情况下,如果您还控制着服务器,那么您可以决定在请求中接受这个主体,并给它任何您想要的语义。也许你正在与别人的服务器合作,他们期望这个身体。

因为规范中没有定义带主体的DELETE请求,而且它们并不常见,所以Axios没有将它们包含在这些方法别名中。但是,因为它们是可能的,你可以做到,只是需要多一点努力。

我认为这将是更传统的包括url上的信息,所以你会这样做:

axios.delete(
  `https://example.com/user/${encodeURIComponent(username}`, 
  { headers: ... }
)

或者,如果您希望能够使用不同的标准删除用户(有时通过用户名,或通过电子邮件,或通过id…)

axios.delete(
  `https://example.com/user?username=${encodeURIComponent(username)}`, 
  { headers: ... }
)

使用{data: {key: value}} JSON对象,示例代码片段如下所示:

// Frontend Code

axios.delete(`URL`, {
        data: {id: "abcd", info: "abcd"},
      })
      .then(res => {
        console.log(res);
      });

// Backend Code (express.js)

  app.delete("URL", (req, res) => {
  const id = req.body.id;
  const info = req.body.info;
  db.query("DELETE FROM abc_table WHERE id=? AND info=?;", [id, info],
    (err, result) => {
      if (err) console.log(err);
      else res.send(result);
    }
  );
});

Axios DELETE请求支持与POST请求类似的功能,但格式不同。

DELETE请求有效负载示例代码:

axios.delete(url, { data: { hello: "world" }, headers: { "Authorization": "Bearer_token_here" } });

POST请求有效负载示例代码:

axios.post(url, { hello: "world" }, { headers: { "Authorization": "Bearer_token_here" } });

注意{hello: "world"}以不同的方式配置,但都执行相同的功能。