azure-active-directory - MSal.js --> ClientAuthError: no_tokens_found: 未找到给定范围的令牌

Question

我有一个单页应用程序 (SPA)，此应用程序使用 msal.js 的预览版登录到 azure 广告 --> https://www.npmjs.com/package/@azure/msal-browser

我正在使用带有 pkce 的授权代码流。

登录工作正常，也可以访问 Microsoft Graph REST API。那里没问题。

当我想访问我自己的 Spring rest API 时，麻烦就开始了。我遵循了本手册：

https://docs.microsoft.com/nl-nl/azure/api-management/api-management-howto-protect-backend-with-aad

所以我创建了两个应用程序注册，一个通过创建范围来公开 api，另一个我添加了该范围的权限。就像说明书告诉我的那样...

在我的单页应用程序中，我有以下代码：

getData: function(){
    const self = this;
    //once login is successful and redirects with tokens, call Graph API (or other api?)

    if (self.myMSALObj.getAccount()) {

      var request = {
          scopes: ["api://fee6e03c-9eb2-41f4-805b-78ac5f4bc5f6/Files.Read"]         
      };


      const tokenResponse = self.myMSALObj.acquireTokenSilent(request)
      .then(response =>{
            console.log(response)
           self.$request({
                url: "http://localhost:8888/api/todolist",
                contentType: "application/x-www-form-urlencoded",
                headers: { 'Authorization': 'Bearer ' + response.accessToken },
                //headers: { 'Authorization': 'Bearer ' + response.idToken },
                timeout: 300 * 1000,
                error: function(xhr, status) {
                    console.error(xhr);
                },
                success: function(data, status, xhr) {
                  console.log(data)
                },
                complete: function() {}
            });
      })
      .catch(error => {
        console.log(error)
          if (error instanceof InteractionRequiredAuthError) {
              // fallback to interaction when silent call fails
              return self.myMSALObj.acquireTokenRedirect(request)
          }
      });


   }        
  }

因此，当我调用此函数时，它正在尝试为此特定范围获取新的访问令牌，然后它应该调用我的休息服务，但它会引发以下错误：

ClientAuthError：no_tokens_found：未找到给定范围的令牌，并且未将授权代码传递给 acquireToken。在调用acquireToken() 之前，您必须检索授权码。范围：api://fee6e03c-9eb2-41f4-805b-78ac5f4bc5f6/files.read offline_access

如果我使用带有 User.read 范围的 microsoft graph api...我完全没有问题...有人知道我在这里缺少什么吗？

提前感谢您的帮助，

问候，

彼得

标签： azure-active-directorymsalmsal.js