angular - 在 'https://login.microsoftonline.com/xxx from origin ' http ://localhost:4200' has been blocked by CORS policy 访问 XMLHttpRequest

Question

似乎是一个重复的问题，但无法解决。我有使用 Msal 强制用户登录的 Angular 6 应用程序。成功登录后，我向 aad 的 token 端点发出请求，传递服务主体凭据(应用程序的应用程序 ID 和客户端 secret )以获取访问 token 以访问图形 API，如前所述 here .这是我收到 CORS 策略错误的地方。

当我禁用 chrome 浏览器安全性时，我没有收到任何 CORS 错误并且能够获取访问 token 。

为什么我仅在尝试使用服务主体凭据而不是在用户使用 msal 登录时尝试获取访问 token 时才收到 CORS 错误？

我是否需要在浏览器端有任何脚本才能使其工作？

如何在不影响安全性的情况下实现它？

登录权限为:https://login.microsoftonline.com/ {租户编号}/

服务主体的 token 端点是:https://login.microsoftonline.com/ {租户 ID}/oauth2/v2.0/token

Answer 1

通常传统或常规网页可以使用 XMLHttpRequest 对象从远程服务器发送和接收数据，但它们受到同源策略的限制。因此，浏览器会阻止它，因为出于安全原因，它通常允许同一来源的请求。虽然 Postman 可以处理这种请求，因为他们不受此策略的限制。

要在 javascript 中集成 Azure Active Directory，建议使用 azure-active-directory-library-for-js这是一个用于前端的 javascript 库，通过使用 implicit grant flow 轻松集成 azure 事件目录。 ，它还有一个优点是消除了对跨源调用的任何要求，如果 JavaScript 应用程序需要联系 token 端点，这是必需的。你也可以看看Here是一个讨论相同主题并显示更多关于如何使用 MSAL.JS 的线程，请引用。

您还可以在 java 脚本中查看客户端请求模式 here .我相信上述过程可能会对您有所帮助。

有关更多详细信息，您可以阅读以下内容:

MSAL Single page application

实现ADAL

Single page application using MSAL for B2C

谢谢。