Azure AD Easy Auth将因CORS错误而过期

Question

问题与Azure AD Easy Auth expires even when users are actively using application相关联。基于共享的解释，似乎Easy Auth机制不适合Azure Web Apps上托管的SPA？ MS可以在官方文档下添加提到的选项 -  “https://docs.microsoft.com/en-in/azure/app-service/app-service-authentication-overview?toc=%2fazure%2fapp-service-web%2ftoc.json”

我面临以下问题：  当AppServiceAuthSession cookie过期时，对基础安全API调用的任何SPA AJAX请求都会因CORS问题而失败：无法加载https://login.windows.net//oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%2Fapp.contoso.com%2F.auth%2Flogin%2Faad%2Fcallback&client_id=xxxxx&scope=openid+profile+email&response_mode=form_post&nonce=xxxxx&state=redir%3D%252Fapi%252Fv2%252Fget-dataapi：CORS已阻止从“https://login.windows.net/xxxxxxxxxxxx/oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%app.contoso.com%2F.auth%2Flogin%2Faad%2Fcallback&client_id=xxxxx&scope=openid+profile+email&response_mode=form_post&nonce=xxxx&state=redir%3D%252Fapi%252Fv2%252Fget-dataapi”重定向到“https://login.microsoftonline.com/xxxxxxxxxx/oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%app.contoso.com%2F.auth%2Flogin%2Faad%2Fcallback&client_id=xxxxxxxxxx&scope=openid+profile+email&response_mode=form_post&nonce=xxxxxxxxxxx&state=redir%3D%252Fapi%252Fv2%252Fget-dataapi”策略：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许原点“https://app.contoso.com”访问。如果不透明响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用CORS的资源。

Answer 1

  

我遇到以下问题：当AppServiceAuthSession cookie过期时，对底层安全API调用的任何SPA AJAX请求都会因CORS问题而失败

根据我的理解，您在SPA中使用了内置的App Service身份验证/授权（EasyAuth）功能，而无需在SPA中编写任何代码或使用客户端库进行身份验证。

对于带有无效cookie或令牌的Ajax请求，我可能遇到类似的问题如下：

此时，您可以捕获Ajax错误并重定向SPA以进行重新身份验证，以检索新的AppServiceAuthSession cookie。

Chris Gillum的答案 Azure AD Easy Auth expires even when users are actively using application 可以适合您的情况。

根据我的经验，您可以使用SPA中的JavaScript client library for Azure Mobile Apps来检索x-zumo-auth令牌，并在Chris Gillum回答时使用令牌方法。简单来说，您可以使用服务器流认证，如下所示：

client.login("aad").done(function (results) {
     alert("You are now logged in as: " + results.userId);
     console.log("x-zumo-auth token is: "+ results.mobileServiceAuthenticationToken);
}, function (err) {
     alert("Error: " + err);
});

此外，您可以使用Active Directory Authentication Library (ADAL) for JavaScript作为juunas评论直接检索AAD id_token或access_token，然后在Authorization标头中包含令牌（id_token，access_token）作为承载令牌以请求您的WebAPI。

此外，您可以对App Service使用客户端流认证，并通过ADAL.js检索id_token或access_token，然后使用前一个令牌登录EasyAuth，以检索AuthenticationToken {{1}然后使用x-zumo-token来请求您的WebAPI。