Server returning 403 on "PUT" request but 200 on any other request method

[SoozaV]

Describe the issue

Hi!
I've noticed that axios is adding an "origin" header on my "PUT" requests, everything works fine when working on localhost, but the problem is in my DEV url, because the origin header looks like this: "http://myurl.com", but the current DEV url is "http://myurl.com/business/dev" (it's ignoring the path after the .com), that's causing a 403 error.

I know it's not possible to overwrite the origin header, and I'm not really sure how to get rid of this error.

All other request (GET, POST, DELETE, etc) are working as expected, and I'm using the same axios instance.

Regards.

Example Code

export const elementsApi = axios.create({
    baseURL: process.env.REACT_APP_ELEMENTS_API_URL,
})
/*-------------------------------------------------*/
// PUT request, error 403
async function updateContent({ elementId, bodyContent }) {
    return await elementsApi.put(`/content/elements`, bodyContent, {
        params: new URLSearchParams({ elementId }),
    });
}

// GET request, success!
async function getElement({ elementId }) {
    return await elementsApi.get(`/content/elements`, {
        params: new URLSearchParams({ elementId }),
    });
}

Expected behavior

No response

Axios Version

1.2.2

Adapter Version

No response

Browser

Brave, Chrome

Browser Version

No response

Node.js Version

No response

OS

No response

Additional Library Versions

No response

Additional context/Screenshots

No response

[Divasraj1]

In this case, It might be due to origin header is not matching the expected value on the server, you're getting a 403 error.

One potential solution is to set the withCredentials configuration option to true when creating your axios instance. This tells the browser to include any cookies in the request, which can help with authentication on the server side.

Here's an updated version of the code that includes this option, this might help :

export const elementsApi = axios.create({ baseURL: process.env.REACT_APP_ELEMENTS_API_URL, withCredentials: true, });

[metuDein]

my delete request is not work tried and tried to no avail :
const handleDelete = async (item) => {
setDeleteId(item?.public_id)
console.log(deleteId)

    try {
        const response = await axios.delete(
            '/images',
            // { headers: { 'Content-Type': 'application/json' }, withCredentials: true },
            { image_id: item._id, public_id: deleteId })
        console.log(response.data)
    } catch (error) {
        console.log(error.response?.data)
    }

}