如何让不受控制的iframe内链接在父窗口打开？

场景1：iframe与父页面同域（可操作iframe DOM） #

如果第三方页面和你的父页面属于同一域名（或子域名且配置了跨域权限），可以直接通过父页面的JS修改iframe内所有链接的跳转目标：

1. 静态链接处理：等iframe加载完成后，遍历所有链接添加target="_top"

const iframe = document.querySelector('iframe');
iframe.addEventListener('load', () => {
  const links = iframe.contentDocument.querySelectorAll('a');
  links.forEach(link => link.target = '_top');
});

2. 动态链接处理：如果页面会动态加载新链接，使用MutationObserver监听DOM变化，自动给新链接添加目标属性

const iframe = document.querySelector('iframe');
iframe.addEventListener('load', () => {
  const observer = new MutationObserver(mutations => {
    mutations.forEach(mutation => {
      if (mutation.addedNodes.length) {
        const newLinks = mutation.target.querySelectorAll('a');
        newLinks.forEach(link => link.target = '_top');
      }
    });
  });
  observer.observe(iframe.contentDocument.body, { childList: true, subtree: true });
});

场景2：iframe为跨域第三方页面（无法直接操作DOM） #

这种情况下无法直接修改iframe内的链接，可通过以下两种方式解决：

方法A：使用PHP代理页面修改内容 #

利用PHP获取第三方页面的HTML内容，替换所有链接的target属性后，让iframe加载这个代理页面：

1. 创建代理文件proxy.php：

<?php
// 获取第三方页面URL（注意做安全校验，避免恶意请求）
$targetUrl = filter_input(INPUT_GET, 'url', FILTER_VALIDATE_URL);
if (!$targetUrl) {
  die('Invalid URL');
}

// 获取页面内容
$content = file_get_contents($targetUrl);
if ($content === false) {
  die('Failed to fetch content');
}

// 替换所有a标签，添加target="_top"
$modifiedContent = preg_replace('/<a(\s[^>]*)?>/i', '<a$1 target="_top">', $content);

// 输出修改后的内容
echo $modifiedContent;
?>

2. 父页面的iframe指向代理页面：

<iframe src="proxy.php?url=https://第三方页面地址"></iframe>

方法B：利用iframe的sandbox属性（有限制） #

给iframe添加sandbox="allow-top-navigation allow-scripts allow-same-origin"属性（根据第三方页面需求调整权限），该属性允许iframe内的页面导航到顶层窗口。但注意：此方法仅当第三方页面的链接跳转行为主动指向顶层时生效，若链接默认是_self，可能仍会在iframe内加载，因此不如代理方法可靠。

<iframe src="第三方页面地址" sandbox="allow-top-navigation allow-scripts allow-same-origin"></iframe>

内容的提问来源于stack exchange，提问作者Stevish