问题描述
当我使用使用oAuth2进行授权的应用在框架内进行授权时，会引发以下错误：
拒绝在帧中显示...，因为它将“ x-frame-options”设置为“ sameorigin”。
它使用oAuth v2。怎么解决？
解决方法
几乎所有的授权服务器都将这样做，以防止点击劫持攻击。如果您拥有服务器，则可以针对特定的受信任来源覆盖它。
但是它可能是完全无法修复的，因为大多数网页不允许其在iframe中运行
一种可行的选择是通过弹出窗口登录，但从可用性的角度来看似乎很差
到目前为止，最好的解决方案是首先避免在iframe中运行Web应用程序。它们是问题的重要根源。您能解释一下为什么要这么做吗？
,该网站出于安全原因有意阻止此行为。
如果有解决方法，则意味着您发现了一个主要的安全错误。 oauth2端点不希望您将其嵌入到iframe中，所以可以：
- 更改oauth2服务器以允许此操作
- 您不能更改此设置，并尝试通过使用框架 not 解决此问题。
我们在 Slack 集成方面遇到了类似的问题。不幸的是，没有好的解决方案可以克服这个问题。您唯一能做的就是在 oAuth 处理期间打开新的空白页面。这就是我的意思。
...
authorizeRedirect(options) {
window.location = this.getAuthorizeUrl(options)
},async authorizeNewWindow(options) {
const authorizeUrl = this.getAuthorizeUrl(options)
window.open(authorizeUrl,'_blank')
},authorize({ type,...options }) {
if (type === 'newWindow') {
return this.authorizeNewWindow(options)
} else {
this.authorizeRedirect(options)
}
},假设您已经拥有用于集成的 Auth 服务，因此不会进一步介绍如何创建完整服务。但是您可以根据上述示例执行以下操作：
- 您可以像往常一样在主平台的同一页面中使用
authorizeRedirect(options)进行授权。 - 使用单独的
authorizeNewWindow(options)在新的空白页面中打开授权页面。这个可以用于 iframe。 - 您可以在所需组件或页面中使用的最后一个
authorize({ type,...options })。
当然，它不能提供良好的用户体验，但由于没有其他方法可以克服它，所以总比崩溃的用户界面要好。