Web app with REST api data layer

Question

I need to have a RESTful API that I can call from an MVC5 web app to initially do just simple authentication/authorization against local sql server exclusively. I need to be able to pass login credentials from the web app to the api to get the header token etc. Then I need to be able to check the token for any requests to pull data or save data back to the db. I'm using the tutorial sample app Here right now until I understand the functionality.

the web side is just a form with a button and some jquery to catch the submit button being clicked:

$(document).ready(function () {

    var register = function() {
        var dataa = {
            Email: "[email protected]",
            Password: "password",
            ConfirmPassword: "password"
        };

        $.ajax({
            type: 'POST',
            url: 'api/Account/Register',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify(dataa)
        });
        return false;
    }

    $('#btnRegister').click(register);
});

and then here is the controller on the api itself:

[Authorize]
[RoutePrefix("api/Account")]
public class AccountController : ApiController
{
    [AllowAnonymous]
    [Route("Register")]
    public async Task<IHttpActionResult> Register(RegisterBindingModel model)
    {
        if (!ModelState.IsValid)
        {
            return BadRequest(ModelState);
        }

        var user = new ApplicationUser() { UserName = model.Email, Email = model.Email };

        IdentityResult result = await UserManager.CreateAsync(user, model.Password);

        if (!result.Succeeded)
        {
            return GetErrorResult(result);
        }

        return Ok();
    }
}

And it's giving me a 404 error now when I try to click it.

Answer 1

Authentication on WebAPI is based on token based OAuth authentication.

There is an authentication URL (/Token for the default created project) and when you make a POST request to that URL with username and password you get a token in response. Your client application should store this token and attach it to each request in order to get Authorized.

Under the hood this token generation and token recognition process is provided by OWin components that are attached to you application pipeline. You can study StartUp.Auth.cs for the initialization of these components.

Your login form has nothing special. It will just post username and password to authentication URL.

How you'll store the token on client side may vary according to your design. Most preferred ways to store the token are using a cookie or a specific token storage in Javascript.

You can check out this tutorial for an example and discussion on basics.