azure - 运行示例 Azure AD B2C 身份验证代码时遇到 x-frame-options 问题

Question

我正在尝试运行 Microsoft 的示例代码来实现 Azure AD B2C 身份验证。代码库可以在这里找到: https://github.com/Azure-Samples/active-directory-b2c-javascript-msal-singlepageapp/blob/master/index.html

我修改了代码，如下所示。主要的变化是，我没有使用 Msal.UserAgentApplication 对象的 loginPopup() 方法，而是使用 loginRedirect() (为了更好的用户体验) https://gist.github.com/ttchuah/6718e268a235a3206968b36d748fd369

这是我运行代码时发生的情况。

1. 我按预期看到了 index.html 页面。
2. 我点击登录按钮，重定向到 Microsoft 登录页面，在这里我可以看到通过 Google 进行社交登录的选项。
3. 我通过 Google 登录并被重定向回我的 index.html 页面。

此时，“authCallback()”函数将被触发。

在 Chrome 中，我收到以下控制台错误。有什么想法吗？拒绝显示'https://accounts.google.com/o/oauth2/auth?client_id=903295266285-78au30g3bsmt8q1phvfqqu65c58kp35i.apps.googleusercontent.com&redirect_uri=https%3a%2f%2flogin.microsoftonline.com%2fte%2fdv0dop000devaad000.onmicrosoft.com%2foauth2%2fauthresp&response_type=code&scope=email+profile&state=StateProperties%3deyJTSUQiOiJ4LW1zLWNwaW0tcmM6OGM1YTQwNDQtNGYyYi00ZTJmLTgyMmUtYjU2ZjRkMWU4ZWU2IiwiVElEIjoiMDBmZjUzOTctNjYxZC00NDY4LWFlODktNzlkOThlMmEwMzI0In0 ' 在框架中，因为它将 'X-Frame-Options' 设置为 'sameorigin'。

同样的错误在 FireFox 或 Safari 中不会发生。对于这些浏览器，我能够毫无问题地取回身份验证 token 。

Answer 1

X-Frame-Options header 是针对 clickjacking 的安全措施问题是，并非所有浏览器都有在处理返回的响应时考虑该 header 的实现(请参阅 MDN 上的 X-Frame-Options)。

长话短说，Chrome 将阻止任何在 X-Frame-Options 中没有匹配 allow-from 值的响应处理在中渲染的strong> header frame , iframe 或 object 元素。

希望对你有帮助!