webFrame

自定义渲染当前网页

webFrame 导出的 Electron module是表示当前frame WebFrame 类的实例。 Sub-frames可以通过特定属性和方法 (例如 webFrame.firstChild) 检索。

将当前页缩放到200% 的示例。

const { webFrame } = require('electron')
webFrame.setZoomFactor(2)

方法

WebFrame 类有以下实例方法:

`webFrame.setZoomFactor(factor)`

factor 双倍缩放倍数；默认值为1.0。

更改缩放倍数。缩放系数是缩放百分比除以 100，即 300% = 3.0。

系数必须大于0.0。

`webFrame.getZoomFactor()`

Returns number - 当前的缩放比例。

`webFrame.setZoomLevel(level)`

level number - 缩放等级。

更改缩放等级。原始尺寸为 0，每升高或将顶代表缩放20%，大和小限制默认分区为 300% 和 50%。

注意: Chromium 级别的缩放策略是同源的，这意味着特定域的缩放级别将传播到具有相同域的所有窗口实例。区分窗口 URL 将使缩放操作工作在每一个窗口。

`webFrame.getZoomLevel()`

Returns number - 当前的缩放比例。

`contents.setVisualZoomLevelLimits(minimumLevel, maximumLevel)`

minimumLevel number
maximumLevel number

设置最大和最小缩放级别。

NOTE: 在 Electron 中 Visual 缩放默认被禁止。重新开启，调用：
contents.setVisualZoomLevelLimits(1, 3)

注意: 视觉缩放仅适用于固定缩放行为。 Cmd+/-/0 缩放快捷键，在菜单中是 'zoomIn', 'zoomOut', 和 'resetZoom' 菜单选项 To disable shortcuts, manually define the Menu and omit zoom roles from the definition.

`webFrame.setSpellCheckProvider(language, provider)`

language string
provider Object
- spellCheck 函数
  - words string[]
  - callback Function
    - misspeltWords string[]

设置输入字段和文本区域的拼写检查提供者。

如果您想要使用此方法，您必须在构建窗口时禁用内置拼写检查器。

const mainWindow = new BrowserWindow({
  webPreferences: {
    spellcheck: false
  }
})

provider 必须是一个接受个别单词组拼写检查方法的 spellCheck 方法的对象。 spellCheck 函数异步运行，完成后调用 callback 函数带有误拼词数组。

使用 [节点拼写检查器][spellchecker] 作为提供程序的实例：

const { webFrame } = require('electron')
const spellChecker = require('spellchecker')
webFrame.setSpellCheckProvider('en-US', {
  spellCheck (words, callback) {
    setTimeout(() => {
      const misspelled = words.filter(x => spellchecker.isMisspelled(x))
      callback(misspelled)
    }, 0)
  }
})

`contents.insertCSS(css[, options])`

css string
options Object (可选)
- cssOrigin string (optional) - Can be 'user' or 'author'. 设置插入格式的 cascade origin 。默认为 'author'.

Returns string - A key for the inserted CSS that can later be used to remove the CSS via webFrame.removeInsertedCSS(key).

Injects CSS into the current web page and returns a unique key for the inserted stylesheet.

`webFrame.removeInsertedCSS(key)`

key string

Removes the inserted CSS from the current web page. 样式由 webFrame.insertCSS(css) 返回的 key 来标识。

`webFrame.insertText(text)`

text string

插入text 到焦点元素

`webFrame.executeJavaScript(code[, userGesture, callback])`

code string
userGesture boolean (可选) - 默认为 false。
callback Function (optional) - Called after script has been executed. Unless the frame is suspended (e.g. showing a modal alert), execution will be synchronous and the callback will be invoked before the method returns. For compatibility with an older version of this method, the error parameter is second.
- result Any
- error Error

返回 Promise<any> - 执行代码结果的 promise 的 resolves，如果执行异常或结果为 rejected promise，则为 rejected。

在页面中执行 code。

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

`webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])`

worldId Integer - The ID of the world to run the javascript in, 0 is the default main world (where content runs), 999 is the world used by Electron's contextIsolation feature. Accepts values in the range 1..536870911.
scripts WebSource[]
userGesture boolean (可选) - 默认为 false。
callback Function (optional) - Called after script has been executed. Unless the frame is suspended (e.g. showing a modal alert), execution will be synchronous and the callback will be invoked before the method returns. For compatibility with an older version of this method, the error parameter is second.
- result Any
- error Error

Returns Promise<any> - A promise that resolves with the result of the executed code or is rejected if execution could not start.

Works like executeJavaScript but evaluates scripts in an isolated context.

Note that when the execution of script fails, the returned promise will not reject and the result would be undefined. This is because Chromium does not dispatch errors of isolated worlds to foreign worlds.

`webFrame.setIsolatedWorldInfo(worldId, info)`

worldId Integer - 执行 javascript 的 world 的 ID，0 是默认 world， 999 是 Electron contextIsolation 的 world 特征。 Chrome extensions reserve the range of IDs in [1 << 20, 1 << 29). You can provide any integer here.
info Object
- securityOrigin string (optional) - Security origin for the isolated world.
- csp string (optional) - Content Security Policy for the isolated world.
- name string (optional) - Name for isolated world. Useful in devtools.

Set the security origin, content security policy and name of the isolated world. Note: If the csp is specified, then the securityOrigin also has to be specified.

`webFrame.getResourceUsage()`

返回 Object:

images MemoryUsageDetails
scripts MemoryUsageDetails
cssStyleSheets MemoryUsageDetails
xslStyleSheets MemoryUsageDetails
fonts MemoryUsageDetails
other MemoryUsageDetails

Returns an object describing usage information of Blink's internal memory caches.

const { webFrame } = require('electron')
console.log(webFrame.getResourceUsage())

This will generate:

{
  images: {
    count: 22,
    size: 2549,
    liveSize: 2542
  },
  cssStyleSheets: { /* same with "images" */ },
  xslStyleSheets: { /* same with "images" */ },
  fonts: { /* same with "images" */ },
  other: { /* same with "images" */ }
}

`webFrame.clearCache()`

尝试释放不再使用的内存 (如以前导航中的图像)。

请注意, 盲目调用此方法可能使Electron较慢, 因为它将不得不重新填充这些清空的缓存。你应该只在这种情况下调用它, 就是当你的应用程序发生的一个事件, 使你认为你的网页实际只使用了较少的内存 (例如你从一个超级重页跳转到一个基本为空的页面, 并打算留在那)。

`webFrame.getFrameForSelector(selector)`

selector string - CSS selector for a frame element.

Returns WebFrame - The frame element in webFrame's document selected by selector, null would be returned if selector does not select a frame or if the frame is not in the current renderer process.

`webFrame.findFrameByName(name)`

name string

Returns WebFrame - A child of webFrame with the supplied name, null would be returned if there's no such frame or if the frame is not in the current renderer process.

`webFrame.findFrameByRoutingId(routingId)`

routingId Integer - An Integer representing the unique frame id in the current renderer process. Routing IDs can be retrieved from WebFrame instances (webFrame.routingId) and are also passed by frame specific WebContents navigation events (e.g. did-frame-navigate)

Returns WebFrame - that has the supplied routingId, null if not found.

`webFrame.isWordMisspelled(word)`

word string - The word to be spellchecked.

Returns boolean - True if the word is misspelled according to the built in spellchecker, false otherwise. If no dictionary is loaded, always return false.

`webFrame.getWordSuggestions(word)`

word string - The misspelled word.

Returns string[] - A list of suggested words for a given word. If the word is spelled correctly, the result will be empty.

属性

`webFrame.top` 只读

一个 WebFrame | null 代表了 webFrame 所属框架层次结构中的顶部帧, 如果顶部帧不在当前的渲染过程中，属性将为 null。

`webFrame.opener` 只读

一个 WebFrame | null 代表了 webFrame所属框架层次结构中的顶部帧, 如果顶部帧不在当前的渲染过程中，属性将为 null。

`webFrame.parent` 只读

一个 WebFrame | null 代表了 webFrame所属框架层次结构中的顶部帧, 如果顶部帧不在当前的渲染过程中，属性将为 null。

`webFrame.firstChild` 只读

一个 WebFrame | null 代表了 webFrame所属框架层次结构中的顶部帧, 如果顶部帧不在当前的渲染过程中，属性将为 null。

`webFrame.nextSibling` 只读

A WebFrame | null representing next sibling frame, the property would be null if webFrame is the last frame in its parent or if the next sibling is not in the current renderer process.

`webFrame.routingId` 只读

一个 Integer 值，表示当前渲染进程中的唯一 frame 的 id。不同的 WebFrame 实例，引用相同的相关 frame，具有相同的 routingId。

[spellchecker]: https://github. com/atom/node-spellchecker

方法​

webFrame.setZoomFactor(factor)​

webFrame.getZoomFactor()​

webFrame.setZoomLevel(level)​

webFrame.getZoomLevel()​

contents.setVisualZoomLevelLimits(minimumLevel, maximumLevel)​

webFrame.setSpellCheckProvider(language, provider)​

contents.insertCSS(css[, options])​

webFrame.removeInsertedCSS(key)​

webFrame.insertText(text)​

webFrame.executeJavaScript(code[, userGesture, callback])​

webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])​

webFrame.setIsolatedWorldInfo(worldId, info)​

webFrame.getResourceUsage()​

webFrame.clearCache()​

webFrame.getFrameForSelector(selector)​

webFrame.findFrameByName(name)​

webFrame.findFrameByRoutingId(routingId)​

webFrame.isWordMisspelled(word)​

webFrame.getWordSuggestions(word)​

属性​

webFrame.top 只读​

webFrame.opener 只读​

webFrame.parent 只读​

webFrame.firstChild 只读​

webFrame.nextSibling 只读​

webFrame.routingId 只读​

方法

`webFrame.setZoomFactor(factor)`

`webFrame.getZoomFactor()`

`webFrame.setZoomLevel(level)`

`webFrame.getZoomLevel()`

`contents.setVisualZoomLevelLimits(minimumLevel, maximumLevel)`

`webFrame.setSpellCheckProvider(language, provider)`

`contents.insertCSS(css[, options])`

`webFrame.removeInsertedCSS(key)`

`webFrame.insertText(text)`

`webFrame.executeJavaScript(code[, userGesture, callback])`

`webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])`

`webFrame.setIsolatedWorldInfo(worldId, info)`

`webFrame.getResourceUsage()`

`webFrame.clearCache()`

`webFrame.getFrameForSelector(selector)`

`webFrame.findFrameByName(name)`

`webFrame.findFrameByRoutingId(routingId)`

`webFrame.isWordMisspelled(word)`

`webFrame.getWordSuggestions(word)`

属性

`webFrame.top` 只读

`webFrame.opener` 只读

`webFrame.parent` 只读

`webFrame.firstChild` 只读

`webFrame.nextSibling` 只读

`webFrame.routingId` 只读