CODEWITHSUNDEEP
javascriptangularjsazureazure-active-directoryadal
af_khan
af_khan

Reputation: 1078

Adal.js not triggering the authentication

I am trying to integrate adal.js in my application. Below is my Code. Could someon please let me know why the authentication is not triggered.

   var app = angular.module('TestWebApp', [
'ngRoute',
'testControllers',
'testServices',
'datatables',
'AdalAngular'

]);

/**
* Configure the Routes
*/
app.config(['$routeProvider', '$httpProvider',     'adalAuthenticationServiceProvider', function ($routeProvider, $httpProvider, adalAuthenticationServiceProvider) {


 $routeProvider
// Home
  .when("/dashboard", {templateUrl: "partials/package.html", controller: "searchCtrl",requireADLogin: true})
// else 404
  .otherwise("/404", {templateUrl: "partials/404.html", controller: "searchCtrl"});

  adalAuthenticationServiceProvider.init(
 {
 tenant: 'test.onmicrosoft.com',
 clientId: '23234sf-sdf-------'
 },
 $httpProvider
);
}]);

And my page url is something link this.

http://localhost:8081/test-ui/#/dashboard

This should go to the Azure login page but its not going.

Upvotes: 1

Views: 1641

Answers (3)

kabaehr
kabaehr

Reputation: 1040

For me the problem was that I had a login button with a form that was redirecting because of action="#" and so the Azure redirecting was not working. I just removed the whole action-attribute and it worked

Upvotes: 1

user4505096
user4505096

Reputation: 11

I think that your tenantID is probably right - it needs to be whatever your AD portal had for the app id URI(minus the name of the application) inside your azure portal. I would also look at the manifest - This is a pretty big deal to have changed. The steps are on the page Omar linked. The SinglePageApp example is a great resource in starting out, and the example is clean, if maybe a bit trivial for the adal portion. You should also check outvittorio's excellent deep dive for a good explanation and great review of adal.js

Upvotes: 1

Omer Cansizoglu
Omer Cansizoglu

Reputation: 1281

Your issue: I think you have an issue with the link. Your link should be like this:http://localhost:8081/test-ui#/dashboard

<a href="#/home">Home</a>
<a href="#/todoList">ToDo List</a>
<a href="#/contactList">Contact List</a>

Adal.Js uses requireADLogin keyword to interrupt the route change event. If you don't see any redirection, it could be related to the routechange event not firing. I suggest to add different routes to your app to verify angular routes first.

General guideline: You can try the sample app first to see if your configurations is working. Sample app:https://github.com/AzureADSamples/SinglePageApp-DotNet

If you have an issue with config, you can follow the steps in the ReadMe file to setup your app config.

If sample app works for your config and your app is having issues, you can see the calls with Fiddler and further debug into adal.js as well. Login redirect event also broadcasts adal:loginRedirect.

Upvotes: 0

Related Questions