10

I'm developing an ASP.NET MVC Web Api with Visual Studio 2013, C# and .NET Framework 4.5.1.

I was reading this article and it is very interesting. It only talks about ASP.NET MVC applications and it doesn't say anything about how to implemented it with Web Api.

I think I can use it with Web Api but I don't know how because, as I read on the article, I will need a login page and a web api doesn't have one.

If I will consume that web api from mobile phones (iOS, Android, Windows Phone, etc.); what do I have to do?

Maybe I will need a login form on the mobile app, or maybe I will need a login page on my web api to allow login on Google, Facebook, etc.

Any advice?

2
  • @MMalke, isn't the link given in the question clear? It looks like it has details about Facebook authentication as well. Jul 24, 2019 at 10:11
  • The article linked in the question does not explain the Web API implementation in such detail. There are some quirks that differentiate the ASP.NET MVC implementation from ASP.NET Web API.
    – MMalke
    Jul 24, 2019 at 13:53

2 Answers 2

6

@VansFannel, this is an old question and I'm guessing you have moved on, but I'm leaving this here for future seekers.

You are correct, it does not offer a login page, but it does offer what the login page itself would use.

Before I begin, go download a Chrome plugin called PostMan. I'll show a few screenshots as I go along using it. I've setup a basic WebAPI with the sample Values controller still in it, but protected with [Authorize]. I'm running my sample WebAPI at http://localhost:54211 for this example.

Here is a high level process:

Creating a User

I'm guessing your don't have any users in this new DB yet, but if you do just skip this. Otherwise, this is how you create them without a UI.

If the body is empty and the header status was 200, then it was successful:

If it failed, you'll get back a header status error of 400 and some kind of error in the body like:

Authenticating

Ok, we have a user in the database, lets authenticate with the WebAPI.

  • POST to http://localhost:54211/token
    • The post should be x-www-form-urlencoded, and should include the following fields:
    • grant_type --- Set it to "password"
    • username --- For example "[email protected]"
    • password --- For example "Test123!"

In the results from the server, if successful (status 200), you will get back what is called a "Bearer Token" - its located in the "access_token" field like this:

For your test, copy that token value to the clipboard (in your app you could store this away in a variable).

Calling a WebAPI method with a Bearer Token

If you try to call an [Authorize] protected method without being authenticated, you will see something like this returned:

But you already authenticated, right? So why doesn't it know you anymore? Because it's REST based and it's stateless - it doesn't know you anymore after the call is complete. So, you have to "remind" it of who you are each time a call is made. You do this by passing the token you received earlier with every request.

  • Call the URL (http://localhost:54211/api/Values/) using whatever verb you need (GET,POST,etc). I'm using GET below, because in the ValuesController that is what is required.
    • In the Header of the request, I add the following field: "Authorization" and it's value as "Bearer [token]" where [token] is the token you stored away earlier.

If you get back a success (200) you can check it's body data and it will have your response:

And that is how it's done! I hope that helps you or others down the road.

1
  • Although your answer is very clear and easy to follow, you didn't cover how External Authentication would work in this case.
    – MMalke
    Jul 18, 2019 at 14:52
0

Web api providees support for integrating with social networks like facebook, twitter, microsoft, google via the owin pipeline.

Find a sample here which provides facebook login support for a web api.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.