cmatskas

Unable to login to Azure Mobile Apps - API Service (formerly know as Azure Mobile Service)

Christos Matskas -

TL;DR Jump to the end of the post for the quick solution

I'm currently working on a new mobile application which has a lot of integration with Azure Mobile Apps service which is part of the Apps service offering on Microsoft's cloud platform. I have been creating a few API endpoints that will be used by the application to store user data and it's been great fun writing all the code and unit tests around it.

Azure Mobile Apps use ASP.NET WebAPI at the core with a few nice wrappers to make the integration as simple as possible. The benefit with this setup is that it's extremely easy to test the service locally during development. Being able to test locally is a blessing and I really enjoy this workflow. However, today I got to the point where I could push to Azure and start testing from within my app code.

One of the great features of the Azure Mobile App is that once you've deployed your service (through Visual Studio or FTP) you can test the Mobile App API on the browser using a built in "Postman" like UI. To do this you need to navigate to your Azure Mobile App web page. The easiest way to achieve this is to log in to the Preview Azure Portal, navigate to your mobile app main blade click on the Browse button on the toolbar located at the top of the blade:

This will open a new browser tab where you'll be presented with the following page:

Now, you can click on the Try it out -> link to test the service using the browser GUI. Unfortunately, this is where you will, most likely, get stuck. To access the API you need to authenticate and this is a great measure as it stops everyone from discovering and (ab)using your API. To authenticate, you need to retrieve your Application Key, which, at the moment, is only available through the old portal. Open a new tab and go to the old portal, navigate to the Dashboard of your mobile app (mobile apps co-exist both in the old and the new site but you should use the new one for most of the settings) and find the keys at the bottom of the page:

Click on the MANAGE KEYS button to get access to your private access keys. Copy the APPLICATION KEY:

Now you can go back to the previous page and attempt to login. Do the following:

  • Leave the username BLANK (don't type anything)
  • Paste the APPLICATION KEY in the password field
  • Submit

If the authentication failed, then there's a setting missing from your Azure Mobile App.

TL;DR - The solution

The reason why the authentication is failing (assuming you pasted the correct application key etc) is that the MS_ApplicationKey application setting missing and needs to be defined through the portal.

Open the Settings blade of your Mobile App on Azure and navigate to Application Settings:

Scroll down until you find the APP Settings section. If the MS_ApplicationKey is missing, you need to create a new entry as per below:

  • Key : MS_ApplicationKey
  • Value : your APPLICATION KEY - the same one you used earlier to try login to the web service
  • Ensure that you click the SAVE button at the top of the blade to apply the new settings.
  • With the new settings applied, restart the service using the button at the top of the main mobile app blade.

Now go back to your web page, refresh the page and try to log in. This time, you should be successful.

I hope I saved you a few hours trying to figure out what's wrong.