Cordoba app using angular & ADAL

I am creating my first mobile application using Cordoba. Internal services live on Azure, so I'm trying to get authentication using the ADAL plugin for Cordoba.

First of all, I found out that the library does not perform hooks, as the ADAL library for Angular does. I use Angular in my Cordova app, paired with material design directives for appearance. It would be nice to have an interception, but, as I understand it, it just wasn't there at the moment (you need to find out how difficult it is to implement it).

So instead, I now wrote a service that takes care of sending REST api requests to Azure, including the correct authentication token. It is based on an example found here .

Here is what I came up with:

var request = function(url) { createContext() .then(function () { getAuthToken().then( function(token) { sendRequest(token, url); }) }, function (err) { $log.error("Failed to create a context."); }); }; 

First, it will create an authentication context:

 function createContext () { return $q(function (resolve, reject) { var authenticationContext = Microsoft.ADAL.AuthenticationContext; authenticationContext.createAsync(authority) .then(function (context) { authContext = context; $log.log("Created authentication context for authority URL: " + context.authority); resolve(); }, function (err) { $log.error("Failed to create authentication context: " + pre(err)) reject(); }); }); }; 

Using the context, it should get an authentication token:

 function getAuthToken() { if (authContext == null) { $log.error('Authentication context isn\'t created yet. Create context first'); return; } return $q(function (resolve, reject) { authContext.acquireTokenAsync(resourceUrl, appId, redirectUrl) .then(function (authResult) { resolve(authResult.accessToken); }, function (err) { $log.error("Failed to acquire token: " + pre(err)); reject(); }); }); } 

And after that he should send a request, but I will leave this part, since it will not get there. I feel the need to re-emphasize that I am full n00b on this material, so please be easy on me and especially on the code. There are probably many opportunities for improvement, I understand.

When I really run this, it opens a window where I need to log in using my Microsoft account, cool. I even received two-factor authentication the first time I tried this, very nice! Therefore, I log in and I return to the code. But now the authresult variable has the status "Failed" and as a result there is no access token. Unfortunately, there is also no indication of what went wrong. So, the first part of the question: what could have gone wrong here?

Now we move on to the second part of the question; how do you properly debug such things? On my desktop, I launched Fiddler to check the connection, but I don’t know how to do it for Android. I am debugging my device because for some reason all the emulators available to me are very slow (VS and Google), although my hardware specifications should support them.

Thanks for any pointers!

Update 02/03/2016

Through the code a bit, I decided to pack in an input function, which gives a slightly shorter example:

 var createContext = function () { if (authContext == null) { authContext = new Microsoft.ADAL.AuthenticationContext(authority); } }; var getAuthToken = function () { if (authContext == null) { $log.error('Authentication context isn\'t created yet. Create context first'); return; } return $q(function (resolve, reject) { authContext.acquireTokenAsync(endpointUrl, appId, redirectUrl) .then(function (authResult) { resolve(authResult.accessToken); }, function (err) { $log.error("Failed to acquire token: " + pre(err)); reject(); }); }); } var login = function () { createContext(); getAuthToken(); } 

This code runs on the following input vars:

 var authority = 'https://login.windows.net/[tenantid]'; var resourceUrl = 'https://graph.windows.net/'; var appId = '1ef41b17-0943-4359-bc12-014f4fd2d841'; var redirectUrl = 'http://MyApp'; 

Now I used chrome: // check what happens on the wire. And to my great surprise, I see a valid SAML token received from Azure. I have my name in it and everything that I would republish, they would not send after a failed authentication. Thus, it seems that although the answer is OK, the ADAL library does not give me the correct answer (Status = Failed). Again there is no clue on how to proceed: S

+7
angularjs cordova visual-studio-cordova azure-active-directory adal
source share
2 answers

I just decided. And, as you would expect, the tool is as simple as it gets. Configuring the application in Azure AD, I chose an application such as a "web application", since it is a web application with Angular and that’s it. Now I assume that since Cordoba translates things into native code, this is not the right choice. As soon as I created a new application as a “native application” instead and used the client ID of it, everything started working ... We sincerely hope this helps someone else in the future ...!

+5
source share

I had a very similar problem when I tried to access the web api from the Cordova application. I used the Uri application identifier for the web api that I wanted to get as resouceURL when I called the getAsync get method. When I changed this to the Web Api client ID, it worked.

0
source share

All Articles