Home / Questions / 90654
Accepted
Yoel Macia Delgado
Asked: 2020-07-27 04:07:19 +0800 CST 2020-07-27 04:07:19 +0800 CST

How can I set the Authorization header in AJAX with the $.post method in jquery ?

  • 772

I have a problem setting the Authorization header with the $.postjquery method.

$.post("http://127.0.0.1:8000/newClient/", {
   beforeSend: function (xhr) {
     xhr.setRequestHeader('Authorization','Basic ' + window.localStorage.getItem('token'));
   },
   data: JSON.stringify(validData)
   }, function (response) {
         console.log("Esto es el token ",window.localStorage.getItem('token'));
         var r = JSON.parse(response);
         console.log(r.status);
})

I have the token set correctly and I get it correctly in the response, I have made many AJAX requests with jquery but never with the method $.post, could it be that this method does not accept the header set?

Error trace.

Uncaught TypeError: Cannot read property 'setRequestHeader' of undefined
javascript

1 Answers

  1. Best Answer

    I have fixed it by creating a javascript function beforeSend.

    var beforeSend = function (xhr) {
    xhr.setRequestHeader('Authorization', 'Token ' + window.localStorage.getItem('token'));
}

    And then setting the ajaxSetup with that function.

    $.ajaxSetup({
   beforeSend: beforeSend
});

    So finally the code would look like this, without the header.

    $.post("http://127.0.0.1:8000/newClient/", {
   data: JSON.stringify(validData)
   }, function (response) {
         console.log("Esto es el token ",window.localStorage.getItem('token'));
         var r = JSON.parse(response);
         console.log(r.status);
})
    • 3