【Azure Developer】在App Service上放置一个JS页面并引用msal.min.js成功获取AAD用户名示例

问题描述

在App Service上放置一个JS页面并引用msal.min.js，目的是获取AAD用户名并展示。

问题解答

示例代码

    




    
Welcome to Azure Service
    

    
     

 

注意事项

1) 在为 msalConfig 配置 authority 的时候，需要注意用指定AAD Application的TenantID，不要使用common代替，不然会遇见如下错误

ServerError: AADSTS50194: Application 'xxxxxxxx-3508-xxxx-8906-xxxx'(xxxxServicePrincipal) is not configured as a multi-tenant application. Usage of the /common endpoint is not supported for such applications created after '10/15/2018'. Use a tenant-specific endpoint or configure the application to be multi-tenant.

 

2） 一定要为AAD Application配置回调地址(Redirect URIs), 不然会得到 AADSTS500113: No reply address is registered for the application.

3)   AAD Application中配置的回调地址一定是正确的地址，避免登陆后回调错误

 

登录演示

 

 

 

参考资料

Microsoft Authentication Library for JavaScript (MSAL.js)  : https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/msal-lts/lib/msal-core

Use MSAL in a national cloud environment : https://learn.microsoft.com/en-us/azure/active-directory/develop/msal-national-cloud?tabs=javascript