Getting Owin Authorization token with AJAX

Question

User1642115476 posted

Hello,

I'm working on a web API and I'm trying to implement an Owin Authorization token.

I've got this in the backend:

public class SimpleAuthorizationServerProvider : OAuthAuthorizationServerProvider
{
public override async Task ValidateClientAuthentication(OAuthValidateClientAuthenticationContext context)
{
context.Validated();
}

public override async Task GrantResourceOwnerCredentials(OAuthGrantResourceOwnerCredentialsContext context)
{

context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });

using (AuthRepository _repo = new AuthRepository())
{
IdentityUser user = await _repo.FindUser(context.UserName, context.Password);

if (user == null)
{
context.SetError("invalid_grant", "The user name or password is incorrect.");
return;
}
}

var identity = new ClaimsIdentity(context.Options.AuthenticationType);
identity.AddClaim(new Claim("sub", context.UserName));
identity.AddClaim(new Claim("role", "user"));

context.Validated(identity);

}
}

And it seems to pass the test in PostMan:

Now what I would like to know is how this would look as an AJAX call. Note that there are two sets of data in the PostMan screen shot: headers and body. These are the sets of data I'd like to know how to put them in an AJAX call.

Thanks.

Answer 1

User1881638666 posted

Hi,

Should set the 'Authorization' header as follows in the request.

Authorization: Bearer [toekn string goes here]

Ex: 

Authorization: Bearer EtLb6h-HKq4Y-dDDUugrVf-llvckSs57vaOGCXvFNlJn_7bRhwWOZiwV9uVm1PayW8X4KVclPv--

in your ajax request set this header value. 

http://www.asp.net/web-api/overview/security/individual-accounts-in-web-api

http://bitoftech.net/2014/06/01/token-based-authentication-asp-net-web-api-2-owin-asp-net-identity/

http://stackoverflow.com/questions/7433556/jquery-jsonp-ajax-authentication-header-not-being-set

http://stackoverflow.com/questions/5507234/how-to-use-basic-auth-with-jquery-and-ajax

Further you may set the header with the token string and test with Postman or fiddler.

Thanks & Regards,

Wenushka

Answer 2

User36583972 posted

Hi  gib9898_00,

gib9898_00

Now what I would like to know is how this would look as an AJAX call

I following code for your reference.

var loginData = {
    grant_type: 'password',
    username: self.loginEmail(),
    password: self.loginPassword()
};

$.ajax({
    type: 'POST',
    url: '/Token',
    headers: { "Accept": "application/json" },
    contentType: "application/x-www-form-url; charset=urf-8",
    data: loginData
}).done(function (data) {
    self.user(data.userName);
    // Cache the access token in session storage.
    sessionStorage.setItem(tokenKey, data.access_token);
}).fail(showError);

Secure a Web API with Individual Accounts and Local Login in ASP.NET Web API 2.2:

http://www.asp.net/web-api/overview/security/individual-accounts-in-web-api

Best Regards,

Yohann Lu

Answer 3

User1642115476 posted

Thanks both, those links helped.