React iframe沙箱不允许任何事情答案

【问题标题】：React iframe sandbox don't allow anythingReact iframe沙箱不允许任何事情
【发布时间】：2019-10-24 18:07:09
【问题描述】：

我需要在 React 应用程序中使用 iframe 沙箱。在其中，我不想允许任何事情并限制任何事情。

所以当我将沙箱作为空白传递时，类似于：-

<iframe
  frameBorder="0"
  ref={(container) => { this.container[index] = container; }}
  srcDoc={thread.body}
  sandbox
/>

我收到了这个 - “警告：收到 true 的非布尔属性 sandbox。”

反应：“^16.5.2”

【问题讨论】：

【解决方案1】：

React 对待 <iframe sandbox /> 就像对待 <iframe sandbox={true} /> 一样，这在这里是不正确的。

根据此处的文档：https://www.w3schools.com/tags/att_iframe_sandbox.asp，浏览器期望沙盒属性为空值。

你应该简单地使用

<iframe
  frameBorder="0"
  ref={(container) => { this.container[index] = container; }}
  srcDoc={thread.body}
  sandbox=""
/>

编辑：

正如 OP 在 cmets 中回答的那样，他必须这样做 sandbox="allow-same-origin allow-popups"。

【讨论】：

感谢您的回答。我也尝试过，因此面临一些跨域问题（因为我在 onLoad 上调整 iframe 的大小）
我猜这是预期的行为。如果您限制所有内容，您将无法调整它的大小。试试sandbox="allow-same-origin"。
是的，它与sandbox="allow-same-origin allow-popups" 合作。添加了allow-popups 以使链接在 iframe 正文中可用。
我很高兴能帮上忙。标记答案。