Axios DELETE Request with a Request Body
This article explains how to send a payload or request body using an
HTTP DELETE request in the Axios HTTP client. While methods like
axios.post() or axios.put() accept data as
their second argument, axios.delete() requires the request
body to be encapsulated within a configuration object under the
data property.
Understanding the
axios.delete() Signature
Unlike axios.post(url, data, config), the shorthand
method for DELETE follows the signature:
axios.delete(url[, config])Because the second parameter is reserved for the request configuration rather than the payload, passing an object directly will cause Axios to treat your payload as request options (such as headers or query parameters) instead of the request body.
Method
1: Using axios.delete with the data Config
Property
To include a request body, define the payload inside the
data property of the config object passed as
the second argument.
import axios from 'axios';
const deleteItem = async () => {
try {
const response = await axios.delete('https://api.example.com/items', {
data: {
id: 101,
reason: 'Duplicate entry'
},
headers: {
'Authorization': 'Bearer YOUR_AUTH_TOKEN'
}
});
console.log('Success:', response.data);
} catch (error) {
console.error('Error:', error.response ? error.response.data : error.message);
}
};
deleteItem();Method 2: Using the Generic Request Config
You can also execute the request using the general
axios(config) function call by explicitly setting the
method to 'delete'.
import axios from 'axios';
const deleteItemWithConfig = async () => {
try {
const response = await axios({
method: 'delete',
url: 'https://api.example.com/items',
data: {
id: 101,
reason: 'Duplicate entry'
}
});
console.log('Success:', response.data);
} catch (error) {
console.error('Error:', error.response ? error.response.data : error.message);
}
};
deleteItemWithConfig();Important Considerations
- Server Support: Although sending a body with a DELETE request is compliant with the HTTP/1.1 specification, some web servers, proxies, and API gateways may ignore or reject payloads on DELETE operations. Ensure your backend explicitly supports reading bodies on DELETE routes.
- Alternative Approaches: If a backend or firewall
strips the DELETE request body, consider passing identifiers via URL
parameters (
/items/101), query parameters (/items?id=101), or using aPOSTrequest with an action-oriented endpoint (e.g.,/items/delete).