在 iFrame 中进行 SSO 身份验证期间出现“X-Frame-Options: DENY”错误

Question

目前，我们正在将单点登录 (SSO) 功能集成到基于 React/Typescript 的 iframe Web 应用程序中，该应用程序在 iframe 中运行。

对于用户身份验证，我们使用 Azure AD B2C，而 AWS Cognito 作为我们用于用户数据管理的内部数据库。在开发过程中，在 iframe 环境中，我们成功实现了 SSO 登录，没有出现任何问题。然而，在将 iframe 应用程序部署到父 Web 应用程序中时，我们在尝试启动 SSO 登录过程时遇到了障碍。

具体来说，我们收到了错误消息： “拒绝在框架中显示‘https://test.b2clogin.com/’，因为它将‘X-Frame-Options’设置为‘拒绝’。” 经过调查，很明显“https://test.b2clogin.com/”的“X-Frame-Options”标头被配置为“拒绝”，从而阻止其在 iframe 中显示。此问题有任何潜在的解决方案或解决方法吗？

我们被这个问题困扰了一整天，找不到任何潜在的解决方案

感谢您的提前帮助！

尝试更改以下内容：

1. AWS Cloudfront 发行版中的 X-Frame-Options。

2. 允许访问控制允许来源*

3. AllowedHeaders 至 *

4. 允许使用“PUT”、“POST”、“DELETE”、“GET”方法。

但没有找到有效的方法。

Answer 1

嵌入 B2C 身份验证体验仅适用于自定义策略。

要在 iFrame 中使用 B2C，请将以下代码添加到您的自定义策略依赖方 XML 文件中

<!--
<RelyingParty>
  <DefaultUserJourney ReferenceId="SignUpOrSignIn" /> -->
  <UserJourneyBehaviors> 
    <JourneyFraming Enabled="true" Sources="https://somesite.com https://anothersite.com" /> 
  </UserJourneyBehaviors>
<!--
</RelyingParty> -->

您可以在 Microsoft Learn 网站上阅读有关如何实现此操作的更多信息。

此功能不适用于开箱即用的用户流程。

---

只要所提供的信息对您有帮助，请不要忘记“接受答案”和“投票”，这对其他社区成员也有好处。