webFrame
自定义渲染当前网页
进程: Renderer
webFrame
export of the Electron module is an instance of the WebFrame
class representing the top frame of the current BrowserWindow
. Sub-frames can be retrieved by certain properties and methods (e.g. webFrame.firstChild
).
将当前页缩放到200% 的示例。
const { webFrame } = require('electron')
webFrame.setZoomFactor(2)
Customize the rendering of the current web page.
Process: Renderer
webFrame
export of the Electron module is an instance of the WebFrame
class representing the top frame of the current BrowserWindow
. Sub-frames can be retrieved by certain properties and methods (e.g. webFrame.firstChild
).
An example of zooming current page to 200%.
const { webFrame } = require('electron')
webFrame.setZoomFactor(2)
方法
The WebFrame
class has the following instance methods:
Methods
The WebFrame
class has the following instance methods:
webFrame.setZoomFactor(factor)
factor
Number - 缩放比例
更改缩放比例。缩放比例是缩放百分比除以 100,如 300% = 3.0。
webFrame.setZoomFactor(factor)
factor
Number - Zoom factor.
Changes the zoom factor to the specified factor. Zoom factor is zoom percent divided by 100, so 300% = 3.0.
webFrame.getZoomFactor()
Returns Number
- 当前的缩放比例。
webFrame.getZoomFactor()
Returns Number
- The current zoom factor.
webFrame.setZoomLevel(level)
level
Number - 缩放等级。
更改缩放等级。 The original size is 0 and each increment above or below represents zooming 20% larger or smaller to default limits of 300% and 50% of original size, respectively.
webFrame.setZoomLevel(level)
level
Number - Zoom level.
Changes the zoom level to the specified level. The original size is 0 and each increment above or below represents zooming 20% larger or smaller to default limits of 300% and 50% of original size, respectively.
webFrame.getZoomLevel()
Returns Number
- The current zoom level.
webFrame.getZoomLevel()
Returns Number
- The current zoom level.
webFrame.setVisualZoomLevelLimits(minimumLevel, maximumLevel)
minimumLevel
NumbermaximumLevel
Number
设置最大和最小缩放级别。
NOTE: Visual zoom is disabled by default in Electron. To re-enable it, call:
webFrame.setVisualZoomLevelLimits(1, 3)
webFrame.setVisualZoomLevelLimits(minimumLevel, maximumLevel)
minimumLevel
NumbermaximumLevel
Number
Sets the maximum and minimum pinch-to-zoom level.
NOTE: Visual zoom is disabled by default in Electron. To re-enable it, call:
webFrame.setVisualZoomLevelLimits(1, 3)
webFrame.setLayoutZoomLevelLimits(minimumLevel, maximumLevel)
minimumLevel
NumbermaximumLevel
Number
设置最大和最小基于布局(例如非图像)的缩放级别。
webFrame.setLayoutZoomLevelLimits(minimumLevel, maximumLevel)
minimumLevel
NumbermaximumLevel
Number
Sets the maximum and minimum layout-based (i.e. non-visual) zoom level.
webFrame.setSpellCheckProvider(language, provider)
language
Stringprovider
ObjectspellCheck
Function.words
String[]callback
FunctionmisspeltWords
String[]
Sets a provider for spell checking in input fields and text areas.
The provider
must be an object that has a spellCheck
method that accepts an array of individual words for spellchecking. The spellCheck
function runs asynchronously and calls the callback
function with an array of misspelt words when complete.
An example of using node-spellchecker as provider:
const { webFrame } = require('electron')
const spellChecker = require('spellchecker')
webFrame.setSpellCheckProvider('en-US', {
spellCheck (words, callback) {
setTimeout(() => {const spellchecker = require('spellchecker')const misspelled = words.filter(x => spellchecker.isMisspelled(x))callback(misspelled)
}, 0)
}
})
webFrame.setSpellCheckProvider(language, provider)
language
Stringprovider
ObjectspellCheck
Function.words
String[]callback
FunctionmisspeltWords
String[]
Sets a provider for spell checking in input fields and text areas.
The provider
must be an object that has a spellCheck
method that accepts an array of individual words for spellchecking. The spellCheck
function runs asynchronously and calls the callback
function with an array of misspelt words when complete.
An example of using node-spellchecker as provider:
const { webFrame } = require('electron')
const spellChecker = require('spellchecker')
webFrame.setSpellCheckProvider('en-US', {
spellCheck (words, callback) {
setTimeout(() => {const spellchecker = require('spellchecker')const misspelled = words.filter(x => spellchecker.isMisspelled(x))callback(misspelled)
}, 0)
}
})
webFrame.insertCSS(css)
css
String - CSS source code.
Inserts css
as a style sheet in the document.
webFrame.insertCSS(css)
css
String - CSS source code.
Inserts css
as a style sheet in the document.
webFrame.insertText(text)
text
String
插入text
到焦点元素
webFrame.insertText(text)
text
String
Inserts text
to the focused element.
webFrame.executeJavaScript(code[, userGesture, callback])
code
StringuserGesture
Boolean (optional) - Default isfalse
.callback
Function (可选) - 在脚本被执行后被调用。result
Any
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
在页面中执行 code
。
在浏览器窗口中,一些HTML API(如requestFullScreen
)只能是 由来自用户的手势调用。 将 userGesture
设置为 true
将删除此限制。
即将弃用
webFrame.executeJavaScript(code[, userGesture, callback])
code
StringuserGesture
Boolean (optional) - Default isfalse
.callback
Function (optional) - Called after script has been executed.result
Any
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Evaluates code
in page.
In the browser window some HTML APIs like requestFullScreen
can only be invoked by a gesture from the user. Setting userGesture
to true
will remove this limitation.
Deprecated Soon
webFrame.executeJavaScript(code[, userGesture])
code
StringuserGesture
Boolean (optional) - Default isfalse
.
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
在页面中执行 code
。
在浏览器窗口中,一些HTML API(如requestFullScreen
)只能是 由来自用户的手势调用。 将 userGesture
设置为 true
将删除此限制。
webFrame.executeJavaScript(code[, userGesture])
code
StringuserGesture
Boolean (optional) - Default isfalse
.
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Evaluates code
in page.
In the browser window some HTML APIs like requestFullScreen
can only be invoked by a gesture from the user. Setting userGesture
to true
will remove this limitation.
webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.scripts
WebSource[]userGesture
Boolean (optional) - Default isfalse
.callback
Function (可选) - 在脚本被执行后被调用。result
Any
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Works like executeJavaScript
but evaluates scripts
in an isolated context.
即将弃用
webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.scripts
WebSource[]userGesture
Boolean (optional) - Default isfalse
.callback
Function (optional) - Called after script has been executed.result
Any
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Works like executeJavaScript
but evaluates scripts
in an isolated context.
Deprecated Soon
webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture])
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. You can provide any integer here.scripts
WebSource[]userGesture
Boolean (optional) - Default isfalse
.
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Works like executeJavaScript
but evaluates scripts
in an isolated context.
webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture])
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. You can provide any integer here.scripts
WebSource[]userGesture
Boolean (optional) - Default isfalse
.
Returns Promise<any>
- A promise that resolves with the result of the executed code or is rejected if the result of the code is a rejected promise.
Works like executeJavaScript
but evaluates scripts
in an isolated context.
webFrame.setIsolatedWorldContentSecurityPolicy(worldId, csp)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.csp
String
Set the content security policy of the isolated world.
webFrame.setIsolatedWorldContentSecurityPolicy(worldId, csp)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.csp
String
Set the content security policy of the isolated world.
webFrame.setIsolatedWorldHumanReadableName(worldId, name)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.name
String
Set the name of the isolated world. Useful in devtools.
webFrame.setIsolatedWorldHumanReadableName(worldId, name)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.name
String
Set the name of the isolated world. Useful in devtools.
webFrame.setIsolatedWorldSecurityOrigin(worldId, securityOrigin)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.securityOrigin
String
Set the security origin of the isolated world.
webFrame.setIsolatedWorldSecurityOrigin(worldId, securityOrigin)
(Deprecated)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.securityOrigin
String
Set the security origin of the isolated world.
webFrame.setIsolatedWorldInfo(worldId, info)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.info
ObjectsecurityOrigin
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.setIsolatedWorldInfo(worldId, info)
worldId
Integer - The ID of the world to run the javascript in,0
is the default world,999
is the world used by ElectronscontextIsolation
feature. Chrome extensions reserve the range of IDs in[1 << 20, 1 << 29)
. You can provide any integer here.info
ObjectsecurityOrigin
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
MemoryUsageDetailsscripts
MemoryUsageDetailscssStyleSheets
MemoryUsageDetailsxslStyleSheets
MemoryUsageDetailsfonts
MemoryUsageDetailsother
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.getResourceUsage()
Returns Object
:
images
MemoryUsageDetailsscripts
MemoryUsageDetailscssStyleSheets
MemoryUsageDetailsxslStyleSheets
MemoryUsageDetailsfonts
MemoryUsageDetailsother
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.clearCache()
Attempts to free memory that is no longer being used (like images from a previous navigation).
Note that blindly calling this method probably makes Electron slower since it will have to refill these emptied caches, you should only call it if an event in your app has occurred that makes you think your page is actually using less memory (i.e. you have navigated from a super heavy page to a mostly empty one, and intend to stay there).
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.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.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 - AnInteger
representing the unique frame id in the current renderer process. Routing IDs can be retrieved fromWebFrame
instances (webFrame.routingId
) and are also passed by frame specificWebContents
navigation events (e.g.did-frame-navigate
)
Returns WebFrame
- that has the supplied routingId
, null
if not found.
webFrame.findFrameByRoutingId(routingId)
routingId
Integer - AnInteger
representing the unique frame id in the current renderer process. Routing IDs can be retrieved fromWebFrame
instances (webFrame.routingId
) and are also passed by frame specificWebContents
navigation events (e.g.did-frame-navigate
)
Returns WebFrame
- that has the supplied routingId
, null
if not found.
属性
Properties
webFrame.top
A WebFrame
representing top frame in frame hierarchy to which webFrame
belongs, the property would be null
if top frame is not in the current renderer process.
webFrame.top
A WebFrame
representing top frame in frame hierarchy to which webFrame
belongs, the property would be null
if top frame is not in the current renderer process.
webFrame.opener
A WebFrame
representing the frame which opened webFrame
, the property would be null
if there's no opener or opener is not in the current renderer process.
webFrame.opener
A WebFrame
representing the frame which opened webFrame
, the property would be null
if there's no opener or opener is not in the current renderer process.
webFrame.parent
A WebFrame
representing parent frame of webFrame
, the property would be null
if webFrame
is top or parent is not in the current renderer process.
webFrame.parent
A WebFrame
representing parent frame of webFrame
, the property would be null
if webFrame
is top or parent is not in the current renderer process.
webFrame.firstChild
A WebFrame
representing the first child frame of webFrame
, the property would be null
if webFrame
has no children or if first child is not in the current renderer process.
webFrame.firstChild
A WebFrame
representing the first child frame of webFrame
, the property would be null
if webFrame
has no children or if first child is not in the current renderer process.
webFrame.nextSibling
A WebFrame
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.nextSibling
A WebFrame
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
An Integer
representing the unique frame id in the current renderer process. Distinct WebFrame instances that refer to the same underlying frame will have the same routingId
.
webFrame.routingId
An Integer
representing the unique frame id in the current renderer process. Distinct WebFrame instances that refer to the same underlying frame will have the same routingId
.