Refused to display ‘‘ in a frame because it set ‘X-Frame-Options‘ to ‘sameorigin‘

出现问题：

项目中有iframe嵌套页面后报错。

出现问题的原因：

nginx代理配置了X-Frame-Options ：DENY

解决办法：

X-Frame-Options 有三个值:

DENY
表示该页面不允许在 frame 中展示，即便是在相同域名的页面中嵌套也不允许。
SAMEORIGIN
表示该页面可以在相同域名页面的 frame 中展示。
ALLOW-FROM uri
表示该页面可以在指定来源的 frame 中展示。

具体分析

DENY 或 SAMEORIGIN 分别是什么意思？

DENY：

• 当设置为 DENY 时，页面不能被嵌入到任何 <iframe>, <frame>, <embed>, 或 <object> 中，无论这些元素是在同一个网站上还是在其他网站上。
• 这意味着其他任何网站都不能将此页面嵌入到它们的页面中。
• 例如, 如果 example.com/page 设置了 X-Frame-Options: DENY, 那么无论是 example.com 还是 other-site.com, 都不能在其页面中嵌入 example.com/page。

SAMEORIGIN：

• 当设置为 SAMEORIGIN 时, 页面只能被同一源 (origin) 的页面嵌入。
• 这意味着只有与内容相同的协议、域名和端口的页面才能嵌入这个页面。其他所有的外部源都不能嵌入。
• 例如, 如果 example.com/page 设置了 X-Frame-Options: SAMEORIGIN, 那么只有 example.com 上的其他页面可以嵌入它。其他域名，如 other-site.com, 不能嵌入这个页面。