axios.delete - must specify 'data' object?

Created on 3 Mar 2017  ·  22Comments  ·  Source: axios/axios

When using the alias axios.delete, the payload doesn't get sent with the API call if you don't specify data.

You have to do:

axios.delete(URL, {
 data: { foo: 'bar' }
})

instead of

axios.delete(URL, { foo: 'bar' })

According to this, you shouldn't have to define data. I've been able to use other methods with payload without specifying data.

Most helpful comment

Nope, this won't work.

What you have to pass to Axios is a Request Config Object and in this object you can find the data and params properties. You will use them to send data to the server.

This way: axios.delete(URL, {params: {foo: 'bar'}})


In a delete request you should use params instead of data, see the docs:

// "data" is the data to be sent as the request body
// Only applicable for request methods 'PUT', 'POST', and 'PATCH'
// When notransformRequestis set, must be of one of the following types:
// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// - Browser only: FormData, File, Blob
// - Node only: Stream

data: { firstName: 'Fred' },

All 22 comments

Nope, this won't work.

What you have to pass to Axios is a Request Config Object and in this object you can find the data and params properties. You will use them to send data to the server.

This way: axios.delete(URL, {params: {foo: 'bar'}})


In a delete request you should use params instead of data, see the docs:

// "data" is the data to be sent as the request body
// Only applicable for request methods 'PUT', 'POST', and 'PATCH'
// When notransformRequestis set, must be of one of the following types:
// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// - Browser only: FormData, File, Blob
// - Node only: Stream

data: { firstName: 'Fred' },

@charlesrochati I'm confused. params is to send query string parameters, that's not what I'm doing.
As for what you quoted above, it says nothing about delete.

params is to send query string parameters, that's not what I'm doing.

If you want to make a axios.delete, that's exactly what you have to do.

You don't use axios.delete(URL, {
data: { foo: 'bar' } //Only applicable for request methods 'PUT', 'POST', and 'PATCH'
})
for a delete request, you will use axios.delete(URL, {
params: { foo: 'bar' }
})

You will send data as the request body ONLY WHEN you are using 'PUT', 'POST', and 'PATCH'.

I'm afraid you're using axios.delete just like a axios.post or (axios.put or axios.patch). When using axios.delete, you'll send an id to a server, and the server itself will find a resource that matches that given id, only then it will be removed (or trigger some action, but the request is mapped as a http delete).

By using axios.delete(URL, {
data: { foo: 'bar' }
}) you're sending a resource, which makes no sense at all.

Take a look at the links below, you will have a better understanding:

http://stackoverflow.com/questions/12142652/what-is-the-usefulness-of-put-and-delete-http-request-methods

https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html [Section 9.7]

The HTTP DELETE method should not have a request body. DELETE is telling the origin server to remove the resource identified by the URI.

In my case, I do give a payload as well. But either way, if it works using data, it should work using the shorthand.

EDIT: The specification does not disallow/forbid passing a payload.

There is no shorthand for axios.delete:

axios.request(config)

axios.get(url[, config])

axios.delete(url[, config])

axios.head(url[, config])

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

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

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

@AkiraLaine the specification also doesn't forbid sending request bodies for GET either. Should axios also allow you to use the short-hand notation for sending request bodies in GET requests as well?

I'm closing the issue as it's the expected behaviour.

@rubennorte I think we should support body in DEL
HTTP 1.1
And for an example, Elastic

@cggaurav it is supported.

axios.delete('/some/uri', { body: 'my delete body' })

On a side note, On the server the id is showing up in req.query instead of req.params when using axios.delete('/some/uri', {params: { id: 1 } }) like this. Just wanted to throw that out there.

@aricsangchat that's likely because you're using express which is not affiliated with axios at all. When express refers to params it is talking about dynamic values matched in the request path. When axios refers to params it is referring to query string parameters.

// Express
router.get('/:foo/:bar', (req, res) => {
  res.json({
    query: req.query,
    params: req.params
  })
})
// Axios
axios.get('/some/uri', { params: { id: 1 } })
.then((response) => console.log(response.data))

The output you'd get from running that would be:

{
  "query": { "id": 1 },
  "params": {
    "foo": "some",
    "bar": "uri"
  }
}

@jcready Yup thats our setup.

Where is written that delete cannot have a body (like post)? It would be nice if axios supports this https://tools.ietf.org/html/draft-ietf-httpbis-p2-semantics-19#page-23

Thank you

FYI. Fair points that DELETE should not have a body. However, sometimes you're stuck having to send a body when the api is out of your control. e.g.
https://auth0.com/docs/api/authorization-extension#remove-user-from-roles 👎

@duhseekoh

const extension_url = 'mycompany.auth0.com'
const access_token = 'abc123'
const user_id = 12345
const role_id = 67890

axios.delete(`https://${extension_url}/users/${role_id}/roles`, {
  headers: {
    'Authorization': `Bearer ${access_token}`,
    'Content-Type': 'application/json'
  },
  body: JSON.stringify([
    user_id
  ])
})

@jcready - For sure and thanks for the example. Just wanted to add some reasoning for why a body may need to be passed on DELETE when using axios.

@duhseekoh Maybe this will help: https://github.com/axios/axios/issues/897#issuecomment-343715381

const response = await axios.delete('/api/matches/delete_match', {
        data: { matchInfo }
    });

I have it working with data but not working with params with version "axios": "^0.17.1"

@quinnliu I think choosing to use data or params depends on how your backend handles the request.

  • Using data is to put the payload inside request body, just as you do with post.
  • Using params is to treat payloads as url params. Like if you send
axios.delete(URL, {
 params: { foo: 'bar' }
})

it's same as sending request to URL?foo=bar.

Abstraction from axios in api. Params in data: name only
`` api.delete(/projects/${idProjectTech}/techs`, {data: { name: data.name }})

Was this page helpful?
0 / 5 - 0 ratings

Related issues

emaincourt picture emaincourt  ·  3Comments

helmus picture helmus  ·  3Comments

Baoyx007 picture Baoyx007  ·  3Comments

ghost picture ghost  ·  3Comments

Spartano picture Spartano  ·  3Comments