Question

我正在尝试从 Azure 获取访问令牌。我正在关注 this 教程，但问题是那家伙正在使用邮递员。它也适用于邮递员，但它在 javascript 中失败，我不明白为什么。

      function getAccessToken() {
        fetch(`${loginUrl}${tenantId}/oauth2/token`, {
          method: "POST",
          body: JSON.stringify({
            grant_type: "client_credentials",
            client_id: clientId,
            client_secret: clientSecret,
            resource: resource,
          })
        })
          .then((response) => {
            console.log(JSON.stringify(response));
          })
          .catch((err) => {
            console.log(JSON.stringify(err));
          });
      }

凭据很好，即 clientId、secret、tennantid 等。我也在 PowerShell 中尝试过，它奏效了：

Invoke-RestMethod `
    -Uri "$loginUrl$tenantId/oauth2/token" `
    -Method Post `
    -Body @{"grant_type"="client_credentials"; "resource" = $resource; "client_id" = $clientId; "client_secret" = $clientSecret }

但是在 js 上我得到以下错误：

<块引用>

从源“null”获取“https://login.microsoftonline.com/myTenantId/oauth2/token”的访问权限已被 CORS 策略阻止：没有“Access-Control-Allow-Origin”标头存在于请求的资源。如果不透明响应满足您的需求，请将请求的模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

我目前正在 HTML 文件中运行此脚本以进行测试。

Answer 1

如果我们在 HTML 页面中直接从与您网站不同的域中调用 rest api，我们将遇到 CORS 问题。这是出于安全原因。详情请参阅here。

所以如果你想在 HTML 页面中获取 Azure AD 令牌，我建议你使用包 msaljs 来实现隐式流来获取令牌。该软件包已修复 cors 问题。关于如何做到这一点，请参阅here。

此外，如果您仍想使用客户端凭据流在 HTML 页面中获取令牌。你有两个选择。一种选择是使用代理服务器。代理充当客户端和服务器之间的中介。有关未来的详细信息，请参阅 blog。

azure 通过 javascript 获取访问令牌

1 个答案: