Introduction

A PUT request is an HTTP request used to update or completely replace an existing resource on a server. It is one of the most common HTTP methods used in REST APIs for modifying data.

Unlike a POST request, which creates a new resource, a PUT request updates an existing one. When using PUT, the client typically sends the entire updated resource in the request body, and the server replaces the existing resource with the new data.

PUT requests are commonly used for updating user profiles, product details, employee records, customer information, and application settings.

For automation engineers, PUT requests are essential for validating update operations, verifying response data, checking status codes, ensuring database changes are reflected correctly, and testing complete update workflows.

In this tutorial, you’ll learn how to send PUT requests using JavaScript with both the Fetch API and Axios.

What is a PUT Request?

A PUT request is an HTTP request used to update or replace an existing resource on a server.

The updated data is sent in the request body.

Why Use PUT Requests?

PUT requests help developers:

Update user information.
Modify product details.
Update employee records.
Change customer information.
Update application settings.
Replace existing resources.
Maintain REST APIs.

Basic Syntax Using Fetch API

fetch(

    "API_URL",

    {

        method: "PUT",

        headers: {

            "Content-Type":

                "application/json"

        },

        body: JSON.stringify({

            name: "John"

        })

    }

);

Basic Syntax Using Axios

import axios

from "axios";

await axios.put(

    "API_URL",

    {

        name: "John"

    }

);

Example 1: Update a Post Using Fetch API

async function updatePost() {

    const response =

        await fetch(

            "https://jsonplaceholder.typicode.com/posts/1",

            {

                method: "PUT",

                headers: {

                    "Content-Type":

                        "application/json"

                },

                body: JSON.stringify({

                    id: 1,

                    title: "Updated Title",

                    body: "Updated Content",

                    userId: 1

                })

            }

        );

    const data =

        await response.json();

    console.log(data);

}

updatePost();

Sample Output

{
  id: 1,
  title: "Updated Title",
  body: "Updated Content",
  userId: 1
}

Example 2: Update User Using Axios

import axios

from "axios";

async function updateUser() {

    const response =

        await axios.put(

            "https://jsonplaceholder.typicode.com/users/1",

            {

                name: "Alice",

                email: "alice@example.com"

            }

        );

    console.log(

        response.data

    );

}

updateUser();

Sample Output

{
  id: 1,
  name: "Alice",
  email: "alice@example.com"
}

Example 3: Update Product Information

const product =

{

    id: 5,

    name: "Gaming Laptop",

    price: 1200

};

await fetch(

    "https://jsonplaceholder.typicode.com/posts/5",

    {

        method: "PUT",

        headers: {

            "Content-Type":

                "application/json"

        },

        body: JSON.stringify(product)

    }

);

Example 4: Verify Response Status

async function verifyStatus() {

    const response =

        await fetch(

            "https://jsonplaceholder.typicode.com/posts/1",

            {

                method: "PUT",

                headers: {

                    "Content-Type":

                        "application/json"

                },

                body: JSON.stringify({

                    title: "Updated"

                })

            }

        );

    console.log(

        response.status

    );

}

verifyStatus();

Sample Output

Example 5: Update Resource Using Axios

import axios

from "axios";

async function updateResource() {

    const response =

        await axios.put(

            "https://jsonplaceholder.typicode.com/posts/2",

            {

                title: "Automation Testing"

            }

        );

    console.log(

        response.data.title

    );

}

updateResource();

Sample Output

Automation Testing

Automation Testing Examples

PUT requests are commonly used in API automation.

Example 1: Validate Status Code

const response =

    await axios.put(

        "https://jsonplaceholder.typicode.com/posts/1",

        {

            title: "Updated"

        }

    );

console.log(

    response.status

);

Sample Output

Example 2: Validate Updated Data

const response =

    await axios.put(

        "https://jsonplaceholder.typicode.com/posts/1",

        {

            title: "JavaScript"

        }

    );

console.log(

    response.data.title

);

Sample Output

JavaScript

Example 3: Verify Resource ID

const response =

    await axios.put(

        "https://jsonplaceholder.typicode.com/posts/10",

        {

            title: "Updated"

        }

    );

console.log(

    response.data.id

);

Sample Output

Example 4: Measure Response Time

const start =

    Date.now();

await axios.put(

    "https://jsonplaceholder.typicode.com/posts/1",

    {

        title: "Performance"

    }

);

const end =

    Date.now();

console.log(

    end - start,

    "ms"

);

Sample Output

140 ms

Example 5: Verify Updated User

const response =

    await axios.put(

        "https://jsonplaceholder.typicode.com/users/1",

        {

            name: "Automation User"

        }

    );

console.log(

    response.data.name

);

Sample Output

Automation User

PUT Request Components

Component	Purpose
URL	Resource endpoint
Method	PUT
Headers	Request information
Body	Updated resource
Response	Updated data

PUT vs POST

Feature	PUT	POST
Purpose	Update existing resource	Create new resource
Idempotent	Yes	No
Request Body	Yes	Yes
Creates Resource	Usually No	Yes
Updates Resource	Yes	No

Real-World Uses of PUT Requests

PUT requests are commonly used for:

Updating user profiles.
Updating products.
Editing customer records.
Updating employee information.
Changing account settings.
Updating inventory.
Editing blog posts.
Updating orders.
API automation.
CRUD operations.

Common Mistakes

Forgetting the Request Body

PUT requests generally require the updated resource to be sent in the request body.

Missing `Content-Type` Header

Always specify:

Content-Type: application/json

when sending JSON data.

Not Validating Updated Data

Always verify that the response contains the expected updated values.

Ignoring Status Codes

Validate that the server returns a successful status code such as 200 OK after the update.

Best Practices

Use async/await for readability.
Send complete resource data when appropriate.
Validate response status codes.
Verify updated response fields.
Store API endpoints in configuration files.
Handle errors using try...catch.
Keep update payloads reusable.

Conclusion

PUT requests play a vital role in REST APIs by allowing clients to update existing resources. They are commonly used whenever an application needs to replace or modify stored information.

For automation engineers, PUT requests are essential for validating update operations, ensuring backend services correctly process changes, verifying response data, and testing complete CRUD workflows. Understanding how to use PUT requests with the Fetch API and Axios is an important step toward building robust API automation frameworks.

Frequently Asked Questions (FAQs)