I am working with a DFR api endpoint:
url = http://example.com/api/data/
The URL of the page where I am running JavaScript code is: http://example.com/page/1/
I have logged in as User1 in my browser.
POST request - from DRF browser API - successful.
GET request - from JavaScript - working fine.
POST request - from JavaScript - encountering a 403 error.
It seems like I might be missing something when it comes to making an authenticated AJAX request from JavaScript. The browser may handle authentication automatically when using the browser API for the same request.
This is my current JavaScript code:
axios({
method: 'post',
baseURL: window.location.origin,
url: '/api/data/',
// adding auth header also gives the same 403 error for post request
// headers: {
// Authorization: 'Token e77b8ca898b51cde72dcf2aa2c385942d771e972'
// },
data: {
name: 'xyz'
},
responseType: 'json',
})
.then(function (response) {
console.log(' success');
})
.catch(function (error) {
console.log(' error=', error.message);
});