我已经在 Angular 4 中创建了应用程序，我正在尝试在应用程序中嵌入画面仪表板。
嵌入式画面仪表板正在提示登录。
<iframe src="https://tableauserver/view/dashboard/12345" sandbox="allow-top-navigation allow-same-origin allow-scripts allow-forms allow-popups"></iframe>
但实际上，当我们在新选项卡中打开相同的链接时，它会使用 sso 进行身份验证并打开仪表板。 tablue link in addressbar
当我们首先在一个选项卡中打开 tableau 仪表板，然后在新选项卡中打开应用程序时，仪表板就会显示。
任何人都可以建议如何在 iframe 中进行此 sso 身份验证
【问题讨论】：
标签： angular iframe tableau-api
这是一项已知的安全功能，可防止 CORS（跨源资源共享）和 CSRF（跨站点请求伪造）安全问题。它是使用 iframe 和 SSO（不仅限于 Tableau）的浏览器中的一种特定攻击媒介，因此大多数浏览器都不会允许它。
您有三个可用选项，具体取决于您的网站设置和您愿意承担的风险级别。
选项 1（最佳选项）：不要使用 iframe。相反，当您在浏览器中单击可视化项上的“嵌入”按钮时，请使用 Tableau 提供的 <embed> 标记。见https://onlinehelp.tableau.com/current/pro/desktop/en-us/shareworkbooks.htm#shareworkbooks.html。
选项 2（不推荐）：关闭 Web 服务器上的 CSRF 保护。使用它需要您自担风险和危险。基本上，不要这样做。我在这里列出它是出于教育目的。
选项 3（安全但需要更多工作）：使用具有可信身份验证的 Tableau Javascript API 将可视化嵌入到您的网页中。需要大量的工作； <embed> 标签更容易。
我们选择了选项 1，从那时起没有任何问题。
【讨论】：