什么是iframe？
Scrapeless Scraping Browser为必须导航和与嵌入式框架交互的自动化工作流提供受管理的Chromium会话。
TL;DR
- iframe在当前页面内嵌入一个独立的文档。 框架文档拥有自己的浏览上下文、窗口、文档、URL和生命周期。
- 同源策略控制跨框边界的脚本访问。 跨源框架保持可见，但其内部DOM不能被父页面自由读取。
- 沙箱属性可以移除能力。 单独的令牌选择性地恢复脚本、表单、导航、弹出窗口和相关行为。
- 每个iframe都有自己的加载和导航状态。 父级准备就绪并不证明子框架的目标内容已准备好。
- 自动化必须在选择元素之前选择正确的框架。 文档级定位器无法直接访问由另一个浏览上下文拥有的DOM节点。
为什么文档边界重要
iframe影响浏览器如何暴露状态、呈现内容或决定何时自动化操作是安全的。一个精确的定义防止团队将狭窄信号视为普遍答案。它还使得测试失败更容易诊断，因为预期的浏览器行为与文档的生命周期、API或系统边界相关。
对于网络自动化，实际问题总是比“页面是否准备好？”或“浏览器看起来真的很真实吗？”要狭窄。下一步可能需要一个控制开启，一个框架完成导航，一个组件附加其内部树，或一个渲染表面保持一致。下面的章节将该概念转化为可观察的检查，而不是依赖民间传说。
iframe定义
iframe，或内联框架，是一个HTML元素，它在当前文档中嵌入另一个文档。嵌入的内容接收其自己的浏览上下文，包括一个窗口、文档、URL、导航历史和生命周期。父页面控制子文档呈现的矩形区域。
该 HTML标准iframe定义 指定了元素、其内容属性、导航行为、沙箱标志、加载和与浏览上下文的集成。子文档可以与父文档同源，也可以来自完全不同的来源。
常见用法包括支付表单、视频播放器、地图、广告、支持小部件、文档预览和嵌入式应用程序。分离可以简化集成并孤立文档，但它也会产生普通嵌套HTML所没有的安全性、性能、可访问性和自动化考虑。
一个独立的浏览上下文
iframe元素属于父DOM，但显示在其中的文档并不会成为该DOM的普通子树。子文档有自己的全局对象，可以独立导航。父子生命周期可以以不同的速度进展，子文档本身可以包含嵌套框架。
对于同源内容，父脚本可以通过平台API访问子窗口和文档。对于跨源内容，同源策略阻止双向的直接DOM访问。这些文档仍然可以通过控制的跨文档消息传递进行协调，当双方实现了共识协议时。
该 MDN iframe元素参考 记录了诸如src、srcdoc、name、loading、referrerpolicy、allow和sandbox等属性。这些控制影响加载的内容、加载时间、发送的信息以及框架页面接收的功能。
同源策略和消息传递
当两个文档的方案、主机和端口在平台的源规则下匹配时，它们就是同源的。同源框架可以紧密合作。跨源框架不能自由读取彼此的DOM、Cookie、存储或JavaScript对象，因为那样会让任何页面检查用户在另一个站点上的认证内容。
该 MDN同源策略指南 解释了边界和受限的跨源交互类别。Window.postMessage提供了一个故意的通信通道。接收者应该验证发送者源，并验证消息结构，而不是接受来自任何来源的消息。
源与站点品牌或可见域文本不同。重定向可以改变框架的最终源。一个开始同源的框架可以后来导航到跨源，从而使直接访问失效。自动化应该检查当前框架URL并将导航视为状态变化。
沙箱和权限
沙箱属性对框架上下文应用了一组限制性的标志。没有令牌，它可以禁用脚本、表单提交、弹出窗口、顶级导航、下载和同源处理。以allow开头的令牌选择性地恢复能力。最小的令牌集比默认授予每个能力更安全。
allow属性和权限策略控制对相机、麦克风、地理定位和全屏等功能的访问。这些控制补充了沙箱；它们并不替代源检查或应用授权。嵌入的第三方只能获得其功能所需的能力。
存在一种危险的配置，当同源嵌入内容同时获得脚本权限和恢复的同源处理下的沙箱。根据上下文，框架页面可能能够移除或逃避限制。安全审查必须考虑实际源、内容控制和令牌组合，而不是孤立地读取每个属性。
加载、性能和可访问性
每个 iframe 都可以通过脚本、样式、图像、字体和子框架启动完整文档加载。多个嵌入会增加内存、CPU 和网络成本。loading 属性可以延迟离屏框架的加载，但惰性加载意味着在父级的初始加载事件触发时，它们的内容可能不存在。
每个有意义的 iframe 都需要一个简明的 title 属性，以告知辅助技术用户嵌入内容的表示。被框架的文档也需要其自身可访问的结构。避免在没有明确路径返回到父级的情况下强制键盘焦点进入嵌入内容，并测试跨边界的 Tab 顺序。
响应式大小调整需要协调，因为父元素控制iframe框，而子元素控制其内容。跨域子元素不能仅仅通过直接的DOM访问来暴露其文档高度。消息传递协议可以报告大小变化，但父元素必须验证消息并防止布局循环。
iframe 自动化模式
自动化首先通过稳定的属性，如 URL、名称、标题或其拥有的 iframe 元素，识别框架。然后，它创建一个框架作用域的定位器，并在该浏览上下文中进行搜索。从父文档中选择可见的子元素而不进入框架将失败，因为该节点属于另一个文档。
等待框架单独附加、导航并渲染目标控件。父级的 DOMContentLoaded 或 load 事件并不能证明子应用已准备好，尤其是在框架懒加载或执行客户端数据获取时。请在框架内使用目标条件。
帧可以在导航过程中分离并被替换。保持定位器的弹性，并避免在过渡过程中缓存帧对象，除非框架保证该身份。对于嵌套帧，一次越过一个边界。当跨源帧拒绝直接页面脚本访问时，自动化框架仍然可以通过浏览器级帧原语进行交互，受限于浏览器和网站的正常安全模型。
选择帧级检查
从最小的条件或配置开始，以证明任务可以继续。保留与标准兼容的浏览器行为，然后仅在工作流程需要时添加配置文件控件。记录浏览器版本和相关状态，以便稍后可以解释差异。可重复的观察比简单声称一个页面、框架、显示或指纹“完成”或“安全”更有用。
- 定义下一个行动。 在等待或配置步骤之后，脚本或用户需要精确执行以下操作。
- 选择一个可观察的信号。 偏好直接支持该操作的浏览器属性、生命周期状态、元素条件或渲染结果。
- 请提供需要翻译的文本。 浏览器、操作系统、屏幕、区域设置、图形和会话设置应描述一个合理的环境。
- 验证正常应用程序行为。 隐私或自动化干预不应默默中断其所更改的 API 或组件。
- 捕获诊断证据。 保存相关的 URL、状态、控制台消息和配置名称，当检查失败时。
结论
一个 iframe 是一个独立的嵌入文档，而不是普通子节点周围的样式容器。源规则、沙盒标志、权限、独立加载和无障碍要求定义了它的行为。可靠的自动化明确选择框架，等待该上下文中的状态，并期望框架能够独立于其父级导航或分离。
规则： 1. 仅输出翻译文本——不提供解释，不加额外的封装代码围栏。 2. 精确保留Markdown/HTML结构（标题、列表、链接、表格）。 3. 保持任何占位符令牌如@@CODEBLOCK_0@@或@@INLINECODE_0@@完全不变；绝不翻译、重排序、合并或重新格式化它们。 4. 不添加或删除```代码围栏，也不要将普通文本包装在代码块中。 Scrapeless Scraping 浏览器文档 解释了如何配置受管浏览器会话，同时 抓取浏览器产品概述 描述浏览器自动化表面。这些资源提供了在授权工作流程中应用该概念的产品背景。
准备好自动化嵌入式文档了吗？
将浏览器渲染、会话配置和自动化基础设施移入受管理的Chromium环境中。
立即注册并获得 $5 的免费积分 — 无需信用卡.
领取您的 5 美元信用 →常见问题解答
iframe是父DOM的一部分吗？
iframe 元素位于父 DOM 中，但嵌入文档存在于一个具有自己 DOM 的独立浏览上下文中。
JavaScript可以读取跨源iframe吗？
不能自由访问。相同来源策略阻止直接的 DOM 访问，而受控通信可以利用 postMessage 进行严格的来源和负载验证。
iframe 的 sandbox 属性有什么作用？
沙箱对嵌入的上下文应用限制，并选择性地允许令牌恢复特定功能，如脚本或表单。
为什么自动化可以看到iframe但看不到它的按钮？
该按钮属于子文档，因此自动化必须在定位内部元素之前进入或目标正确的框架。