为什么无法通过代码获取跨域iframe的内容，存在哪些安全风险？

无法通过代码读取跨域iframe内容的核心原因 #

你用到的iframe代码如下：

<iframe src="example.com"></iframe>

你能手动在浏览器打开链接查看内容、用开发者工具查看iframe内容，和代码无法读取内容的差异本质是操作主体的区别：

• 手动查看是用户主动发起的授权操作，浏览器默认信任用户对本地已加载资源的访问权限，你看到的是已经下载到你本地浏览器的数据，不存在跨用户的身份冒用风险。
• 站点代码自动读取属于无用户主动授权的自动执行行为，这是浏览器同源策略明确禁止的能力。同源策略要求只有两个页面的协议、域名、端口三者完全一致时，才允许互相访问DOM、Cookie、存储数据等敏感资源，跨域的父页面和iframe默认被隔离，不允许互相读写DOM内容。

放开该限制会导致的安全风险 #

如果浏览器放开这个限制，会直接造成大规模的用户敏感信息泄露，举个实际的攻击场景：

假设用户已经在浏览器登录了个人网银站点bank.com，站点保存了用户的登录态Cookie。此时用户访问了恶意站点evil.com，恶意站点内嵌了一个隐藏的iframe指向bank.com，如果没有跨域限制，恶意站点的JS代码可以直接读取iframe内的所有DOM内容，包括用户的银行卡余额、交易流水、个人身份证号等敏感信息，甚至可以模拟用户操作发起转账请求，用户全程无感知就会造成财产损失。

你提到的仅想获取视频src是合理的合法需求，但浏览器的安全规则是通用的，不可能针对个别合法场景单独放开限制，否则恶意开发者完全可以利用同一个能力做恶意操作。

合法获取跨域iframe内容的可行方案 #

如果你确实需要拿到iframe内的指定数据，可以通过两种合法路径实现：

• 若iframe站点归属方可配合，可以让对方通过postMessageAPI主动把需要的数据传递给父页面，或是配置对应的CORS规则允许你的站点跨域请求资源
• 你可以在自己的服务端新增一层代理，由服务端请求iframe站点的页面内容解析出视频src后，再返回给前端使用，绕开浏览器的同源策略限制

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