Iframe禁止弹窗

一、业务场景

移动端H5开发，经常需要展示新闻资讯等内容，新闻资讯经常分为几种，

一种是根据字段拼出，自己写样式展示；

一种直接拿到HTML代码，富文本展示；

还有一种就是给你url链接，利用iframe嵌入展示；（重点）

二、问题描述

利用iframe嵌入网页时，网页本身自带a标签，点击则弹出新窗口，而我们并不希望它弹出；

三、解决方案

利用iframe自带属性sandbox解决
sandbox=“allow-top-navigation allow-same-origin allow-forms allow-scripts”

demo:

<iframe 
    src="https://www.baidu.com" 
    width="100%" height="100%" 
    scrolling="auto" 
    sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts">
</iframe>

四、解释

sandbox 属性
“” 应用以下所有的限制。
allow-same-origin 允许 iframe 内容被视为与包含文档有相同的来源。
allow-top-navigation 允许 iframe 内容从包含文档导航（加载）内容。
allow-forms 允许表单提交。
allow-scripts 允许脚本执行。
allow-popups 允许弹出窗口（如window.open，a标签target="_blank"）。

将allow-popups不添加上去，其余都添加上去即可实现。
ps:百度搜sandbox属性，很多都没介绍allow-popups，实属坑。。。