PUT and DELETE are the two different types of HTTP request methods. HTTP protocol supports many methods to transfer data from the server or do any operation on the server. The HTTP protocol supports the following methods, e.g. GET, POST, PUT, DELETE, PATCH, COPY, HEAD, OPTIONS, etc. Before we dive into the main difference between PUT and DELETE request methods, let us look into HTTP methods.
What is PUT request method?Â
It is used when the client is sending a replacement document or uploading a new document to the Web server under the request URL.
What is DELETE request method?Â
It is used when the client is trying to delete a document from the web server, identified by the request URL.
Example: Let us look into an example of PUT request method.
Javascript
function easyHTTP() {Â
    // Initialising new XMLHttpRequest method.    this.http = new XMLHttpRequest();}Â
// Make an HTTP PUT RequesteasyHTTP.prototype.put = function (url, data, callback) {Â
    // Open an object (POST, PATH,    // ASYNC-TRUE/FALSE)    this.http.open('PUT', url, true);Â
    // Set content-type    this.http.setRequestHeader(        'Content-type', 'application/json');Â
    // Assigning this to self to have scope    // of this into the function onload()    let self = this;Â
    // When the response is ready    this.http.onload = function () {Â
        // Callback function (Error, response text)        callback(null, self.http.responseText);    }Â
    // Since the data is an object so    // we need to stringify it    this.http.send(JSON.stringify(data));}Â
// Instantiating easyHTTPconst http = new easyHTTP;Â
// Data that we need to updateconst data = {    title: ‘Custom Putt’,    body: ‘This is a custom put’};Â
// Put prototype method(url,data,response text)http.put(Â Â Â Â data, function (err, post) {Â
        if (err) {            console.log(err);        }        else {            console.log(post);        }Â
    }); |
Example: The following code demonstrates the DELETE request method.
Javascript
function easyHTTP() {Â
    // Initialising new XMLHttpRequest method.    this.http = new XMLHttpRequest();}Â
// Make an HTTP Delete RequesteasyHTTP.prototype.delete = function (url, callback) {Â
    // Open an object (GET/POST, PATH,    // ASYNC-TRUE/FALSE)    this.http.open('DELETE', url, true);Â
    // Assigning this to self to have     // scope of this into the function    let self = this;Â
    // When the response is ready    this.http.onload = function () {Â
        // Checking status        if (self.http.status === 200) {Â
            // Callback function(Error, response text)            callback(null, 'Post Deleted');        } else {Â
            // Callback function (Error message)            callback('Error: ' + self.http.status);        }    }Â
    // Send the request    this.http.send();}Â
// Instantiating easyHTTPconst http = new easyHTTP;Â
// Delete prototype method(URL, // callback(error,response text))http.delete(Â Â Â Â function (err, response) {Â Â Â Â Â Â Â Â if (err) {Â Â Â Â Â Â Â Â Â Â Â Â console.log(err);Â Â Â Â Â Â Â Â } else {Â Â Â Â Â Â Â Â Â Â Â Â console.log(response);Â Â Â Â Â Â Â Â }Â Â Â Â }); |
Difference between PUT and DELETE:
| PUT Request | DELETE Request |
| It is used to Create or Modify a resource. | It is used to delete a resource identified by a URL. |
| It is idempotent. | It is also idempotent. |
| On successful resource creation, HTTP success code 201(Created). | On successful deletion of record, we can see 200 (OK) or 204 (No Content). |
