如何在尚不支持的浏览器中处理 iframe 的“allow-modals”沙箱标志？

【问题标题】：How to handle the 'allow-modals' sandbox flag for iframes in browsers that do not yet support it?如何在尚不支持的浏览器中处理 iframe 的“allow-modals”沙箱标志？
【发布时间】：2015-11-03 08:03:21
【问题描述】：

从 Chrome 46 开始，需要在 iframe 的沙盒属性中添加“allow-modals”标志，以允许模式（如警报和确认）脱离 iframe。目前没问题。

但是，当您在尚不支持该标志的浏览器（如 Safari 或 Chrome 46 之前的版本）中运行该代码时，您会收到以下错误： 解析“沙盒”属性时出错：“允许模式”是无效的沙盒标志。

有人知道如何在不进行某种浏览器嗅探的情况下解决此问题吗？

【问题讨论】：

标签： iframe sandbox allow-modals

【解决方案1】：

似乎添加它的唯一方法是通过 JS 追溯。

function allowModals(){
  for (const i of document.getElementsByTagName('iframe')) {
    if (!i.sandbox.supports('allow-modals')) {
      console.warn("Your browser doesn't support the 'allow-modals' attribute :(");
      break;
    }
    if (i.sandbox.contains('allow-modals')) continue;
    console.info(i, "doesn't allow modals");
    i.sandbox.add('allow-modals');
    console.info(i, 'now allows modals');
  }
}

<button onclick='allowModals()' style='display: block'>Allow modals</button>
<iframe src="//example.com"></iframe>

在旧浏览器中不能使用新属性值似乎非常奇怪。向后不兼容的更改不是网络应该工作的方式。：/

【讨论】：

感谢您的回复！