使用 ADAL.js 获取的令牌针对 Azure 移动服务应用程序进行身份验证

Question

我正在尝试根据 Azure 移动服务应用验证 HTML 应用。

设置

两个应用程序都使用 AAD 作为身份验证后端，因此两个应用程序都有一个在 Active Directory 中注册的应用程序：

Azure 移动服务应用程序：

如https://azure.microsoft.com/en-gb/documentation/articles/mobile-services-how-to-register-active-directory-authentication/
我编辑了清单以启用客户端流程
为 "Windows Azure Active Directory"

HTML 应用程序：

在 "permissions to other applications" 中，我添加了具有委派权限的 Azure 移动服务应用 "access"

Azure 移动服务使用 .NET 后端，我在其中包含并配置了 NuGet 包 "Microsoft Azure Mobile Services .NET Backend Security Extension"，如 https://azure.microsoft.com/en-gb/documentation/articles/mobile-services-dotnet-backend-windows-phone-get-started-users/

中所述

HTML 应用程序使用 ADAL.JS 和 Angular:

adalAuthenticationServiceProvider.init(
{
    // Config to specify endpoints and similar for your app
    clientId: "<html app aad client id>",
    redirectUri: "<html app redirect uri>",
    endpoints: {
        '<AMS app client id>': 'https://ampapp.azure-mobile.net/'
    }
},
$httpProvider
);

此设置按预期工作，我打开我的 html 应用程序，针对 Azure AD 进行身份验证，重定向到我的应用程序并登录。此外，当我尝试访问我的 Azure 移动服务时我看到 Adal.js 注入了不记名令牌。

问题

Azure 移动服务不接受不记名令牌 - 我收到 401 未授权。我不知道为什么，但 Azure 移动服务使用它自己的身份验证 header - 但没问题。

MSDN 为 Azure 移动服务定义了所谓的 "Client-directed login operation"：

"Requests an authentication token from Microsoft Azure Mobile Services by using an identity token already obtained from an identity provider." (https://msdn.microsoft.com/en-us/library/azure/jj710106.aspx)

好的，让我们这样做：

 // obtain token for Azure Mobile Service from Adal.js
 var token = this.getAADToken(ZUMOAuthenticationProvider.Config().url);

 $http({
        method: 'POST',
        url: ZUMOAuthenticationProvider.Config().url + 'login/aad', 
        data: JSON.stringify({
                  "access_token" : token 
              }),
        headers: {
                 'X-ZUMO-APPLICATION': '<application key>'
       }).
       success(function (data, status, headers, config) {
            alert(data);
       }).
       error(function (data, status, headers, config) {
            alert(data);
       });

注意：第一行获取的令牌实际上是 azure 移动服务 aad 应用程序的访问令牌，而不是 HTML 应用程序的访问令牌。

此 POST 请求也得到 401 响应。所以我不知道如何验证我的应用程序。我还尝试了 azure 移动服务 js 库。这个库有效，但它使用弹出窗口进行身份验证，但我不喜欢将另一个库添加到我的项目中以进行几次 REST 调用。

类似问题

在尝试解决我的问题时，我发现了其他 Whosebug post:

同样的问题，没有解决方案（即使在最后一条评论中链接的聊天记录中）

与上述同一作者，我检查了接受的答案中提到的所有内容，但它不起作用

我还从新的 Azure 管理门户查看了新的 Azure 移动应用程序，但它们似乎使用相同的身份验证机制。

那么，我怎样才能让它工作？

Answer 1

您可以使用 AzureMobileServices 客户端脚本使用已获得的令牌进行登录：

您需要包含以下脚本： https://ajax.aspnetcdn.com/ajax/mobileservices/MobileServices.Web-1.2.8.min.js

然后在您使用 ADAL.JS 获得令牌后，您可以使用它登录并获得移动服务身份验证令牌：

var appUrl = 'https://foobar.azure-mobile.net'
  , appKey = 'zumo key' // found on the dashboard of the mobile service
  , client = new WindowsAzure.MobileServiceClient(appUrl, appKey);

// ...
var token = this.getAADToken(ZUMOAuthenticationProvider.Config().url);

client
  .login('aad', { 'access_token': token })
  .then(function() {
    // client.currentUser.mobileServiceAuthenticationToken
  });

此令牌随后需要包含在后续移动服务 API 请求中：

var config = {
  headers: {
    'X-ZUMO-AUTH': client.currentUser.mobileServiceAuthenticationToken
  }
}

$http
  .get(appUrl + '/some/path', config)
  .then(function (r) {
     console.log(r);
  });

Answer 2

POST 可能 returns 401，因为 AAD 令牌的受众不正确。移动服务希望这是它的 /login/aad 端点，但我怀疑您发送的令牌实际上是在您调用的网站范围内。委托访问权限只是表示您可以从站点获取令牌并将其转换为移动服务的令牌。它不会改变发行令牌本身的性质。

因此，最好的建议是确保您登录到移动服务受众，或执行委托访问流程。不幸的是，后者似乎没有太多样本unless using ADAL.NET

一种解决方法是将移动服务上的 MS_AadAudience 应用设置设置为与您网站的设置相匹配。只有当站点和移动服务存在于您的应用程序的相同逻辑安全边界内时，您才应该这样做。也就是说，此时任何可以登录您站点的都可以访问移动服务。总的来说，更好的方法是获取移动服务的访问令牌。

Answer 3

好的，我找到了我的错误：

endpoints: {
    '<AMS app client id>': 'https://ampapp.azure-mobile.net/'
}

这应该是

endpoints: {
    'https://ampapp.azure-mobile.net/': '<AMS app id uri>': 
}

之后就可以了！我打算发布一个 Angular 模块到 github，它将 X-Auth-User header 中的令牌注入每个请求，就像 adal.js 那样。

编辑：

正如这里承诺的更详细的答案：

如我的问题所述，您必须在 Azure Active Directory 中设置 2 个应用程序：

Azure 移动服务的 AAD 应用程序
- 只需按照此 article
HTML 应用的 AAD 应用
- 将 "oauth2AllowImplicitFlow" 设置为 "true"
- 在 "permissions to other applications" 下添加 Azure 移动服务 AAD 应用程序

配置 Angular 应用程序以将 Azure 移动服务用作端点

adalAuthenticationServiceProvider.init(
{
    clientId:"54110492-4ae3-4c9f-9530-3101458d43fb",
    redirectUri: "https://localhost:44304/",
    endpoints: {
        'https://zumodemoapp.azure-mobile.net/': 'https://zumodemoapp.azure-mobile.net/login/aad'
    }
},
$httpProvider
);

现在您可以使用 Client-directed login operation 获取 Azure 移动服务身份验证令牌。

var zumoAppID = 'https://zumodemoapp.azure-mobile.net/login/aad';
var zumoLoginUri = 'https://zumodemoapp.azure-mobile.net/login/aad';
var zumoTodoController = 'https://zumodemoapp.azure-mobile.net/tables/TodoItem';

// 1. acquire a oath token for our zumo app from azure ad via adal.js
adalAuthenticationService.acquireToken(zumoAppID).then(function (data) {
     //2. we have the azure ad token, lets get a azure mobile service token
     $http.post(zumoLoginUri,
                JSON.stringify({
                    "access_token": data
                })).
                success(function (data, status, headers, config) {
                    //3. with the azure mobile service token we can authenticate our request
                    $http.get(zumoTodoController,
                                          {
                                              headers:  {
                                                      'X-ZUMO-AUTH': data.authenticationToken
                                              }
                                          }).
                                          success(function (data, status, headers, config) {
                                              alert(data); //yay!
                                          });
                }).
                error(function (data, status, headers, config) {
                    alert(data);
                });
});

如评论中所述，我创建了一个更详细的博客 post here。如果您需要更多信息，请发表评论:)。

使用 ADAL.js 获取的令牌针对 Azure 移动服务应用程序进行身份验证

Authenticate against an Azure Mobile Service App with ADAL.js acquired token

c#

mobile

azure

azure-mobile-services

adal

设置

问题

类似问题