Microsoft Graph API：访问令牌 403 禁止错误使用 ajax 调用但使用邮递员正常工作答案

【问题标题】：Microsoft Graph API: Access Token 403 Forbidden error Using ajax call but works properly using postmanMicrosoft Graph API：访问令牌 403 禁止错误使用 ajax 调用但使用邮递员正常工作
【发布时间】：2021-09-19 16:29:36
【问题描述】：

当我尝试从邮递员打一个休息电话时，我能够获得访问令牌，但使用 ajax 调用我收到 403 禁止错误。附加 https://cors-anywhere.herokuapp.com/ url 来访问令牌 url 以避免 CORS 错误。

  const formData = new FormData();
    formData.append("client_id", "client_id");
    formData.append("client_secret", "S7D7Q~excS5KjBh9JnPK-afZjTjtALGTKNweP");
    formData.append("grant_type", "client_credentials");
    formData.append("scope", "https://graph.microsoft.com/.default");
    $(document).ready(function () {
    requestToken();
   });
   var token;
function requestToken() {
  $.ajax({
    async: true,
    crossDomain: true,
    credentials: "include",
    url: "https://cors-anywhere.herokuapp.com/https://login.microsoftonline.com/b262d1f3-4738-400d-ad54-c82cdabb6540/oauth2/v2.0/token", 
    method: "POST",
    headers: {
      "content-type": "application/x-www-form-urlencoded"
    },
    cache: false,
    processData: false,
    contentType: false,
    data: formData,
    success: function (response) {
      console.log(response);
      token = response.access_token;
    },
  });
}

【问题讨论】：

我同意@juunas，他提到的 msal.js 是你应该在项目中使用的，你可以参考this answer 或这个sample code

标签： azure-active-directory microsoft-graph-api postman

【解决方案1】：

您不应在前端使用客户端凭据。这是您的应用程序的密码，任何访问该页面的人都可以看到。此外，如果这是您在问题中的实际秘密，您应该删除它并创建一个新的。

此网址无效：

https://cors-anywhere.herokuapp.com/https://login.microsoftonline.com/b262d1f3-4738-400d-ad54-c82cdabb6540/oauth2/v2.0/token

您收到 CORS 错误的原因是 Azure AD 试图阻止您自己动手。 AAD 看到请求并认为它不应该来自浏览器前端，因此拒绝了它。获取令牌的正确方法是使用MSAL.js 并代表登录用户获取令牌（委托权限）。

【讨论】：