跳至主要内容

webFrameMain

控制网页和 iframe。

进程: 主进程

webFrameMain 模块可用于在现有的 WebContents 实例中查找帧。导航事件是常见的用例。

const { BrowserWindow, webFrameMain } = require('electron')

const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('https://twitter.com')

win.webContents.on(
  'did-frame-navigate',
  (event, url, httpResponseCode, httpStatusText, isMainFrame, frameProcessId, frameRoutingId) => {
    const frame = webFrameMain.fromId(frameProcessId, frameRoutingId)
    if (frame) {
      const code = 'document.body.innerHTML = document.body.innerHTML.replaceAll("heck", "h*ck")'
      frame.executeJavaScript(code)
    }
  }
)

你也可以使用 WebContents 的 mainFrame 属性访问现有页面的帧。

const { BrowserWindow } = require('electron')

async function main () {
  const win = new BrowserWindow({ width: 800, height: 600 })
  await win.loadURL('https://reddit.com')

  const youtubeEmbeds = win.webContents.mainFrame.frames.filter((frame) => {
    try {
      const url = new URL(frame.url)
      return url.host === 'www.youtube.com'
    } catch {
      return false
    }
  })

  console.log(youtubeEmbeds)
}

main()

方法​

这些方法可以从 webFrameMain 模块访问。

webFrameMain.fromId(processId, routingId)​

  • processId 整数 - 表示拥有该帧的进程的内部 ID 的 Integer。
  • routingId 整数 - 表示当前渲染进程中唯一帧 ID 的 Integer。路由 ID 可以从 WebFrameMain 实例（frame.routingId）中获取，并且在特定于帧的 WebContents 导航事件（例如 did-frame-navigate）中也会传递。

返回 WebFrameMain | undefined - 具有给定进程和路由 ID 的帧，或者如果不存在与给定 ID 关联的 WebFrameMain，则返回 undefined。

类: WebFrameMain​

进程: 主进程
此类未从 'electron' 模块导出。它仅作为 Electron API 中其他方法的返回值提供。

实例事件​

事件: 'dom-ready'​

当文档加载时发出。

实例方法​

frame.executeJavaScript(code[, userGesture])​

  • code 字符串
  • userGesture 布尔值（可选） - 默认值为 false。

返回 Promise<unknown> - 一个承诺，它将使用执行代码的结果解析，或者如果执行抛出异常或导致承诺被拒绝，则会拒绝。

在页面中评估 code。

在浏览器窗口中，一些 HTML API（如 requestFullScreen）只能由用户的操作调用。将 userGesture 设置为 true 将删除此限制。

frame.reload()​

返回 boolean - 是否成功启动了重新加载。仅在帧没有历史记录时才会导致 false。

frame.send(channel, ...args)​

  • channel 字符串
  • ...args any[]

通过 channel 向渲染进程发送异步消息，以及参数。参数将使用 结构化克隆算法 进行序列化，就像 postMessage 一样，因此不会包含原型链。发送函数、Promise、符号、弱映射或弱集合将引发异常。

渲染进程可以通过使用 ipcRenderer 模块监听 channel 来处理消息。

frame.postMessage(channel, message, [transfer])​

  • channel 字符串
  • message any
  • transfer MessagePortMain[]（可选）

向渲染进程发送消息，可以选择将零个或多个 MessagePortMain 对象的所有权转移。

转移的 MessagePortMain 对象将通过访问发出的事件的 ports 属性在渲染进程中可用。当它们到达渲染进程时，它们将是本机 DOM MessagePort 对象。

例如

// Main process
const win = new BrowserWindow()
const { port1, port2 } = new MessageChannelMain()
win.webContents.mainFrame.postMessage('port', { message: 'hello' }, [port1])

// Renderer process
ipcRenderer.on('port', (e, msg) => {
  const [port] = e.ports
  // ...
})

实例属性​

frame.ipc 只读​

一个作用域到该帧的 IpcMain 实例。

使用 ipcRenderer.send、ipcRenderer.sendSync 或 ipcRenderer.postMessage 发送的 IPC 消息将按照以下顺序传递

  1. contents.on('ipc-message')
  2. contents.mainFrame.on(channel)
  3. contents.ipc.on(channel)
  4. ipcMain.on(channel)

使用 invoke 注册的处理程序将按照以下顺序检查。第一个定义的处理程序将被调用，其余处理程序将被忽略。

  1. contents.mainFrame.handle(channel)
  2. contents.handle(channel)
  3. ipcMain.handle(channel)

在大多数情况下，只有 WebContents 的主帧才能发送或接收 IPC 消息。但是，如果启用了 nodeIntegrationInSubFrames 选项，则子帧也可以发送和接收 IPC 消息。WebContents.ipc 接口在未启用 nodeIntegrationInSubFrames 时可能更方便。

frame.url 只读​

一个 string，表示帧的当前 URL。

frame.origin 只读​

一个 string，表示帧的当前来源，根据 RFC 6454 进行序列化。这可能与 URL 不同。例如，如果该帧是一个打开到 about:blank 的子窗口，则 frame.origin 将返回父帧的来源，而 frame.url 将返回空字符串。没有方案/主机/端口三重来源的页面将具有 "null" 的序列化来源（即，包含字母 n、u、l、l 的字符串）。

frame.top 只读​

一个 WebFrameMain | null，表示 frame 所属的帧层次结构中的顶层帧。

frame.parent 只读​

一个 WebFrameMain | null，表示 frame 的父帧，如果 frame 是帧层次结构中的顶层帧，则该属性将为 null。

frame.frames 只读​

一个 WebFrameMain[] 集合，包含 frame 的直接后代。

frame.framesInSubtree 只读​

一个 WebFrameMain[] 集合，包含 frame 的子树中的每个帧，包括自身。这在遍历所有帧时可能很有用。

frame.frameTreeNodeId 只读​

一个 Integer，表示帧的内部 FrameTreeNode 实例的 ID。此 ID 在浏览器中是全局的，并且唯一标识一个托管内容的帧。标识符在帧创建时固定，并在帧的整个生命周期内保持不变。当帧被移除时，ID 不会再次使用。

frame.name 只读​

一个 string，表示帧名称。

frame.osProcessId 只读​

一个 Integer，表示拥有此帧的进程的操作系统 pid。

frame.processId 只读​

一个 Integer，表示拥有此帧的进程的 Chromium 内部 pid。这与 OS 进程 ID 不同；要读取该 ID，请使用 frame.osProcessId。

frame.routingId 只读​

一个表示当前渲染进程中唯一帧 ID 的Integer。引用相同底层帧的不同WebFrameMain实例将具有相同的routingId。

frame.visibilityState 只读​

一个表示帧的可见性状态的string。

另请参见页面可见性 API如何受其他 Electron API 影响。