发送已验证的请求

Question

I have an MVC project secured with a asp.net identity:

This is my Login function:

self.login = function () {
    event.preventDefault();
    if (!$('#formLogin').valid()) {
        return false;
    }
    var loginData = {
        grant_type: 'password',
        username: self.userName(),
        password: self.password()
    };
    $.ajax({
        type: 'POST',
        url: '/API/Token',
        data: loginData
    }).done(function (data) {
        // Cache the access token in session storage.
        sessionStorage.setItem(tokenKey, data.access_token);
        self.authenticate();
        //change status of Login button to Logout
        self.redirect('Users');
    }).fail(showError);
}

self.authenticate = function () {
    self.token = sessionStorage.getItem(tokenKey);
    var headers = {};
    console.log(self.token);
    if (self.token) {
        headers.Authorization = 'Bearer ' + self.token;
    }
    $.ajaxSetup({
        headers: headers
    });
}

That works fine, I get the token successfully and the headers are set up correctly.

The problem is that when I try to send a request- for example:

self.getUsers = function () {
    $.get("/API/Users/GetUsers/");
}

I get a 401 error from the server:

"message": "Authorization has been denied for this request."

What am I doing wrong?

Answer 1

According to the official documentation of the jQuery.ajax, use this to set custom headers of each request:

$.ajaxSetup({
    beforeSend: function(xhr) {
        xhr.setRequestHeader('Authorization', '...');
    }
});