Access Bearer Token from Adal within Angular for authenticated Download

I have a problem using Adal.JS within a Angular.JS SPA: after the user has authenticated (normal AAD redirect flow), the Bearer Token gets added to the Authorization-Header just as is it should be.

Now the tricky part: in certain situations I need to download a file from the Server which is only accessable to authorized users. Unfortunately I do not have a proper solution for that scenario yet. When I use $window.open('domain.com/api/getSecretFile?id=1'); to trigger the file download in a new window (to keep angular instance alive) the browser won't add the Bearer-Token to the Authorization-Header (as it is outside of angular) --> the Server will reject the unauthorized call - which is 100% logical. So how can I fix this issue?

My idea: change the window open call to something like $window.open('domain.com/api/getSecretFile?id=1&token=mybearertoken'); so the API can check this additional parameter somehow. Therefor I need to get the Bearer Token which is available somewhere within Angular. But where? And how can I access the Bearer Token? Any Ideas?

In my case the server-side part is realized by ASP.Net. For this part there is a solution available: .NET Web API 2 OWIN Bearer Token Authentication direct call

But first I need to access the Token. Or maybe there is a different and proper way to solve the problem? Thanks in advance!

Answers


I found a solution to access the Bearer token within Angular:

app.controller('someController', ['adalAuthenticationService', function (adalAuthenticationService) {

  var resource = adalAuthenticationService.getResourceForEndpoint('domain.com/');
  var tokenStored = adalAuthenticationService.getCachedToken(resource);
  alert(tokenStored);
}]);

domain.com would be the ressource defined under Endpoints within your Adal.JS init: adalAuthenticationServiceProvider.init(...).


You can have define the endpoint list and use interceptor call.


Need Your Help