This article configures the AAD tenant info in the angular scripts which will expose these info from clients, it increases risk of revealing sensitive info.
You can consider store all info and operate authentication and authorization flows at backend in Node.js applications. And only expose Apis for frontend angular clients.
You can refer to the sample provided by O365 at gitHub which leverages ADAL module.
And the main authentication and authorization flows are written at https://github.com/OfficeDev/O365-Nodejs-Microsoft-Graph-Connect/blob/master/authHelper.js.
And the usage with access token in requests in Node.js you can refer to https://github.com/OfficeDev/O365-Nodejs-Microsoft-Graph-Connect/blob/master/requestUtil.js
update
I find the ADAL.js is designed follow the oauth2 authentication via response type of id_token. Which means it will only expose tenantId and AAD application clientId which are not so sensitive info. And the ADAL.js will store the access_token and several user info in html5 sesstionStorage. you can refer to http://www.cloudidentity.com/blog/2015/02/19/introducing-adal-js-v1/ and http://www.cloudidentity.com/blog/2014/10/28/adal-javascript-and-angularjs-deep-dive/ for more info.
About the ADAL.js usage, you can parse the access token via JWT in your backend app with your own logic, and you can refer to the sample at https://github.com/matvelloso/AADNodeJWT.
Meanwhile, in my opinion, you can separate your MEAN app into 2 independent Azure Web Apps. One to build your Angular App as the frontend, and other host your Expressjs Node.js App as the backend of our entire web app architecture.
In the backend Web App service, you can use Azure Active Directory as an authentication provider to protect your Web Apis. refer to https://azure.microsoft.com/en-us/documentation/articles/app-service-mobile-how-to-configure-active-directory-authentication/ for details.
And in the frontend Web App service, you can use adal.js
and adal-angular.js
in the Angular app for authentication and authorization.You can refer to the frontend part of https://github.com/matvelloso/AADNodeJWT.
When you successfully finish the authentication flow, the adal.js
plugin will store the idtoken
in html5 sesstionstorage
, so we can leverage this token to request the backend app which is protected by AAD:
var token = sessionStorage.getItem('adal.idtoken');
$http.defaults.headers.common.Authorization= 'Bearer '+token;
$http.get('https://<your_backend_apis>').then(function (data){
console.log(data);
})