Skip to main content

BrowserView

History
Version(s)Changes
None
API DEPRECATED

注意 BrowserView 类已弃用,并由新的 WebContentsView 类取代。

¥The BrowserView class is deprecated, and replaced by the new WebContentsView class.

BrowserView 可用于将其他 Web 内容嵌入到 BrowserWindow 中。它就像一个子窗口,只不过它是相对于其所属窗口定位的。它旨在作为 webview 标签的替代品。

¥A BrowserView can be used to embed additional web content into a BrowserWindow. It is like a child window, except that it is positioned relative to its owning window. It is meant to be an alternative to the webview tag.

类:BrowserView

¥Class: BrowserView

History
Version(s)Changes
None
API DEPRECATED

创建和控制视图。

¥Create and control views.

注意 BrowserView 类已弃用,并由新的 WebContentsView 类取代。

¥The BrowserView class is deprecated, and replaced by the new WebContentsView class.

进程:主进程

¥Process: Main

app 模块的 ready 事件发出之前,该模块无法使用。

¥This module cannot be used until the ready event of the app module is emitted.

示例

¥Example

// In the main process.
const { app, BrowserView, BrowserWindow } = require('electron')

app.whenReady().then(() => {
const win = new BrowserWindow({ width: 800, height: 600 })

const view = new BrowserView()
win.setBrowserView(view)
view.setBounds({ x: 0, y: 0, width: 300, height: 300 })
view.webContents.loadURL('https://electron.nodejs.cn')
})

new BrowserView([options]) 实验性已弃用

¥new BrowserView([options]) Experimental Deprecated

History
Version(s)Changes
None
API DEPRECATED
  • options 对象(可选)

    ¥options Object (optional)

    • webPreferences WebPreferences(可选) - 网页功能的设置。

      ¥webPreferences WebPreferences (optional) - Settings of web page's features.

      • devTools 布尔值(可选) - 是否启用 DevTools。如果设置为 false,则无法使用 BrowserWindow.webContents.openDevTools() 打开 DevTools。默认为 true

        ¥devTools boolean (optional) - Whether to enable DevTools. If it is set to false, can not use BrowserWindow.webContents.openDevTools() to open DevTools. Default is true.

      • nodeIntegration 布尔值(可选) - 是否启用节点集成。默认为 false

        ¥nodeIntegration boolean (optional) - Whether node integration is enabled. Default is false.

      • nodeIntegrationInWorker 布尔值(可选) - 是否在 Web Worker 中启用节点集成。默认为 false。有关此内容的更多信息,请参阅 多线程

        ¥nodeIntegrationInWorker boolean (optional) - Whether node integration is enabled in web workers. Default is false. More about this can be found in Multithreading.

      • nodeIntegrationInSubFrames 布尔值(可选) - 用于在 iframe 和子窗口等子框架中启用 Node.js 支持的实验选项。你的所有预加载将为每个 iframe 加载,你可以使用 process.isMainFrame 来确定你是否在主框架中。

        ¥nodeIntegrationInSubFrames boolean (optional) - Experimental option for enabling Node.js support in sub-frames such as iframes and child windows. All your preloads will load for every iframe, you can use process.isMainFrame to determine if you are in the main frame or not.

      • preload 字符串(可选) - 指定将在页面中运行其他脚本之前加载的脚本。无论节点集成是打开还是关闭,该脚本始终可以访问 Node API。该值应该是脚本的绝对文件路径。当节点集成关闭时,预加载脚本可以将节点全局符号重新引入全局作用域。参见示例 此处

        ¥preload string (optional) - Specifies a script that will be loaded before other scripts run in the page. This script will always have access to node APIs no matter whether node integration is turned on or off. The value should be the absolute file path to the script. When node integration is turned off, the preload script can reintroduce Node global symbols back to the global scope. See example here.

      • sandbox 布尔值(可选) - 如果设置,这会将与窗口关联的渲染器沙箱化,使其与 Chromium 操作系统级沙箱兼容并禁用 Node.js 引擎。这与 nodeIntegration 选项不同,预加载脚本可用的 API 更加有限。了解有关选项 此处 的更多信息。

        ¥sandbox boolean (optional) - If set, this will sandbox the renderer associated with the window, making it compatible with the Chromium OS-level sandbox and disabling the Node.js engine. This is not the same as the nodeIntegration option and the APIs available to the preload script are more limited. Read more about the option here.

      • session 会议(可选) - 设置页面使用的会话。你还可以选择使用接受分区字符串的 partition 选项,而不是直接传递 Session 对象。当同时提供 sessionpartition 时,优先选择 session。默认是默认会话。

        ¥session Session (optional) - Sets the session used by the page. Instead of passing the Session object directly, you can also choose to use the partition option instead, which accepts a partition string. When both session and partition are provided, session will be preferred. Default is the default session.

      • partition 字符串(可选) - 根据会话的分区字符串设置页面使用的会话。如果 partitionpersist: 开头,则页面将使用可用于应用中具有相同 partition 的所有页面的持久会话。如果没有 persist: 前缀,页面将使用内存中会话。通过分配相同的 partition,多个页面可以共享同一个会话。默认是默认会话。

        ¥partition string (optional) - Sets the session used by the page according to the session's partition string. If partition starts with persist:, the page will use a persistent session available to all pages in the app with the same partition. If there is no persist: prefix, the page will use an in-memory session. By assigning the same partition, multiple pages can share the same session. Default is the default session.

      • zoomFactor 号码(可选) - 页面默认缩放倍数,3.0 代表 300%。默认为 1.0

        ¥zoomFactor number (optional) - The default zoom factor of the page, 3.0 represents 300%. Default is 1.0.

      • javascript 布尔值(可选) - 启用 JavaScript 支持。默认为 true

        ¥javascript boolean (optional) - Enables JavaScript support. Default is true.

      • webSecurity 布尔值(可选) - 当 false 时,它会禁用同源策略(通常是人们使用测试网站),如果用户没有设置此选项,则将 allowRunningInsecureContent 设置为 true。默认为 true

        ¥webSecurity boolean (optional) - When false, it will disable the same-origin policy (usually using testing websites by people), and set allowRunningInsecureContent to true if this options has not been set by user. Default is true.

      • allowRunningInsecureContent 布尔值(可选) - 允许 https 页面从 http URL 运行 JavaScript、CSS 或插件。默认为 false

        ¥allowRunningInsecureContent boolean (optional) - Allow an https page to run JavaScript, CSS or plugins from http URLs. Default is false.

      • images 布尔值(可选) - 启用图片支持。默认为 true

        ¥images boolean (optional) - Enables image support. Default is true.

      • imageAnimationPolicy 字符串(可选) - 指定如何运行图片动画(例如 GIF)。可以是 animateanimateOncenoAnimation。默认为 animate

        ¥imageAnimationPolicy string (optional) - Specifies how to run image animations (E.g. GIFs). Can be animate, animateOnce or noAnimation. Default is animate.

      • textAreasAreResizable 布尔值(可选) - 使 TextArea 元素可调整大小。默认为 true

        ¥textAreasAreResizable boolean (optional) - Make TextArea elements resizable. Default is true.

      • webgl 布尔值(可选) - 启用 WebGL 支持。默认为 true

        ¥webgl boolean (optional) - Enables WebGL support. Default is true.

      • plugins 布尔值(可选) - 是否应启用插件。默认为 false

        ¥plugins boolean (optional) - Whether plugins should be enabled. Default is false.

      • experimentalFeatures 布尔值(可选) - 启用 Chromium 的实验性功能。默认为 false

        ¥experimentalFeatures boolean (optional) - Enables Chromium's experimental features. Default is false.

      • scrollBounce 布尔值(可选)macOS - 在 macOS 上启用滚动弹跳(橡皮筋)效果。默认为 false

        ¥scrollBounce boolean (optional) macOS - Enables scroll bounce (rubber banding) effect on macOS. Default is false.

      • enableBlinkFeatures 字符串(可选) - 由 , 分隔的功能字符串列表,例如要启用的 CSSVariables,KeyboardEventKey。支持的功能字符串的完整列表可以在 RuntimeEnabledFeatures.json5 文件中找到。

        ¥enableBlinkFeatures string (optional) - A list of feature strings separated by ,, like CSSVariables,KeyboardEventKey to enable. The full list of supported feature strings can be found in the RuntimeEnabledFeatures.json5 file.

      • disableBlinkFeatures 字符串(可选) - 由 , 分隔的功能字符串列表,例如要禁用的 CSSVariables,KeyboardEventKey。支持的功能字符串的完整列表可以在 RuntimeEnabledFeatures.json5 文件中找到。

        ¥disableBlinkFeatures string (optional) - A list of feature strings separated by ,, like CSSVariables,KeyboardEventKey to disable. The full list of supported feature strings can be found in the RuntimeEnabledFeatures.json5 file.

      • defaultFontFamily 对象(可选) - 设置字体系列的默认字体。

        ¥defaultFontFamily Object (optional) - Sets the default font for the font-family.

        • standard 字符串(可选) - 默认为 Times New Roman

          ¥standard string (optional) - Defaults to Times New Roman.

        • serif 字符串(可选) - 默认为 Times New Roman

          ¥serif string (optional) - Defaults to Times New Roman.

        • sansSerif 字符串(可选) - 默认为 Arial

          ¥sansSerif string (optional) - Defaults to Arial.

        • monospace 字符串(可选) - 默认为 Courier New

          ¥monospace string (optional) - Defaults to Courier New.

        • cursive 字符串(可选) - 默认为 Script

          ¥cursive string (optional) - Defaults to Script.

        • fantasy 字符串(可选) - 默认为 Impact

          ¥fantasy string (optional) - Defaults to Impact.

        • math 字符串(可选) - 默认为 Latin Modern Math

          ¥math string (optional) - Defaults to Latin Modern Math.

      • defaultFontSize 整数(可选) - 默认为 16

        ¥defaultFontSize Integer (optional) - Defaults to 16.

      • defaultMonospaceFontSize 整数(可选) - 默认为 13

        ¥defaultMonospaceFontSize Integer (optional) - Defaults to 13.

      • minimumFontSize 整数(可选) - 默认为 0

        ¥minimumFontSize Integer (optional) - Defaults to 0.

      • defaultEncoding 字符串(可选) - 默认为 ISO-8859-1

        ¥defaultEncoding string (optional) - Defaults to ISO-8859-1.

      • backgroundThrottling 布尔值(可选) - 当页面变为背景时是否限制动画和计时器。这也影响了 页面可见性 API。当单个 browserWindow 中显示的至少一个 webContents 禁用了 backgroundThrottling 时,将绘制框架并交换整个窗口及其显示的其他 webContents。默认为 true

        ¥backgroundThrottling boolean (optional) - Whether to throttle animations and timers when the page becomes background. This also affects the Page Visibility API. When at least one webContents displayed in a single browserWindow has disabled backgroundThrottling then frames will be drawn and swapped for the whole window and other webContents displayed by it. Defaults to true.

      • offscreen 布尔值(可选) - 是否为浏览器窗口启用离屏渲染。默认为 false。有关详细信息,请参阅 离屏渲染教程

        ¥offscreen boolean (optional) - Whether to enable offscreen rendering for the browser window. Defaults to false. See the offscreen rendering tutorial for more details.

      • contextIsolation 布尔值(可选) - 是否在单独的 JavaScript 上下文中运行 Electron API 和指定的 preload 脚本。默认为 truepreload 脚本运行的上下文只能访问其自己专用的 documentwindow 全局变量,以及其自己的一组 JavaScript 内置函数(ArrayObjectJSON 等),这些对加载的内容都是不可见的。Electron API 仅在 preload 脚本中可用,在加载的页面中不可用。加载潜在不受信任的远程内容时应使用此选项,以确保加载的内容不会篡改 preload 脚本和正在使用的任何 Electron API。此选项使用与 Chrome 内容脚本 使用的技术相同的技术。你可以通过在控制台选项卡顶部的组合框中选择 'Electron 隔离上下文' 条目来在开发工具中访问此上下文。

        ¥contextIsolation boolean (optional) - Whether to run Electron APIs and the specified preload script in a separate JavaScript context. Defaults to true. The context that the preload script runs in will only have access to its own dedicated document and window globals, as well as its own set of JavaScript builtins (Array, Object, JSON, etc.), which are all invisible to the loaded content. The Electron API will only be available in the preload script and not the loaded page. This option should be used when loading potentially untrusted remote content to ensure the loaded content cannot tamper with the preload script and any Electron APIs being used. This option uses the same technique used by Chrome Content Scripts. You can access this context in the dev tools by selecting the 'Electron Isolated Context' entry in the combo box at the top of the Console tab.

      • webviewTag 布尔值(可选) - 是否启用 <webview> 标签。默认为 false。注意:为 <webview> 配置的 preload 脚本在执行时将启用节点集成,因此你应确保远程/不受信任的内容无法使用可能是恶意的 preload 脚本创建 <webview> 标记。你可以使用 webContents 上的 will-attach-webview 事件来删除 preload 脚本并验证或更改 <webview> 的初始设置。

        ¥webviewTag boolean (optional) - Whether to enable the <webview> tag. Defaults to false. Note: The preload script configured for the <webview> will have node integration enabled when it is executed so you should ensure remote/untrusted content is not able to create a <webview> tag with a possibly malicious preload script. You can use the will-attach-webview event on webContents to strip away the preload script and to validate or alter the <webview>'s initial settings.

      • additionalArguments 字符串[](可选) - 将在此应用的渲染器进程中附加到 process.argv 的字符串列表。对于将少量数据传递到渲染器进程预加载脚本非常有用。

        ¥additionalArguments string[] (optional) - A list of strings that will be appended to process.argv in the renderer process of this app. Useful for passing small bits of data down to renderer process preload scripts.

      • safeDialogs 布尔值(可选) - 是否启用浏览器风格的连续对话框保护。默认为 false

        ¥safeDialogs boolean (optional) - Whether to enable browser style consecutive dialog protection. Default is false.

      • safeDialogsMessage 字符串(可选) - 触发连续对话保护时显示的消息。如果未定义,将使用默认消息,请注意,当前默认消息是英文且未本地化。

        ¥safeDialogsMessage string (optional) - The message to display when consecutive dialog protection is triggered. If not defined the default message would be used, note that currently the default message is in English and not localized.

      • disableDialogs 布尔值(可选) - 是否完全禁用对话框。覆盖 safeDialogs。默认为 false

        ¥disableDialogs boolean (optional) - Whether to disable dialogs completely. Overrides safeDialogs. Default is false.

      • navigateOnDragDrop 布尔值(可选) - 将文件或链接拖放到页面上是否会导致导航。默认为 false

        ¥navigateOnDragDrop boolean (optional) - Whether dragging and dropping a file or link onto the page causes a navigation. Default is false.

      • autoplayPolicy 字符串(可选) - 应用于窗口中内容的自动播放策略,可以是 no-user-gesture-requireduser-gesture-requireddocument-user-activation-required。默认为 no-user-gesture-required

        ¥autoplayPolicy string (optional) - Autoplay policy to apply to content in the window, can be no-user-gesture-required, user-gesture-required, document-user-activation-required. Defaults to no-user-gesture-required.

      • disableHtmlFullscreenWindowResize 布尔值(可选) - 进入 HTML 全屏时是否阻止窗口调整大小。默认为 false

        ¥disableHtmlFullscreenWindowResize boolean (optional) - Whether to prevent the window from resizing when entering HTML Fullscreen. Default is false.

      • accessibleTitle 字符串(可选) - 仅向屏幕阅读器等辅助工具提供的替代标题字符串。用户不能直接看到该字符串。

        ¥accessibleTitle string (optional) - An alternative title string provided only to accessibility tools such as screen readers. This string is not directly visible to users.

      • spellcheck 布尔值(可选) - 是否启用内置拼写检查器。默认为 true

        ¥spellcheck boolean (optional) - Whether to enable the builtin spellchecker. Default is true.

      • enableWebSQL 布尔值(可选) - 是否启用 WebSQL API。默认为 true

        ¥enableWebSQL boolean (optional) - Whether to enable the WebSQL api. Default is true.

      • v8CacheOptions 字符串(可选) - 强制执行 Blink 使用的 v8 代码缓存策略。接受的值为

        ¥v8CacheOptions string (optional) - Enforces the v8 code caching policy used by blink. Accepted values are

        • none - 禁用代码缓存

          ¥none - Disables code caching

        • code - 基于启发式的代码缓存

          ¥code - Heuristic based code caching

        • bypassHeatCheck - 绕过代码缓存启发式但使用惰性编译

          ¥bypassHeatCheck - Bypass code caching heuristics but with lazy compilation

        • bypassHeatCheckAndEagerCompile - 与上面相同,只是编译是预先的。默认策略是 code

          ¥bypassHeatCheckAndEagerCompile - Same as above except compilation is eager. Default policy is code.

      • enablePreferredSizeMode 布尔值(可选) - 是否启用首选尺寸模式。首选尺寸是包含文档布局所需的最小尺寸(无需滚动)。启用此选项将导致当首选大小更改时在 WebContents 上发出 preferred-size-changed 事件。默认为 false

        ¥enablePreferredSizeMode boolean (optional) - Whether to enable preferred size mode. The preferred size is the minimum size needed to contain the layout of the document—without requiring scrolling. Enabling this will cause the preferred-size-changed event to be emitted on the WebContents when the preferred size changes. Default is false.

      • transparent 布尔值(可选) - 是否开启访客页面背景透明。默认为 true。注意:访客页面的文本和背景颜色源自其根元素的 配色方案。启用透明度后,文本颜色仍会相应变化,但背景将保持透明。

        ¥transparent boolean (optional) - Whether to enable background transparency for the guest page. Default is true. Note: The guest page's text and background colors are derived from the color scheme of its root element. When transparency is enabled, the text color will still change accordingly but the background will remain transparent.

实例属性

¥Instance Properties

使用 new BrowserView 创建的对象具有以下属性:

¥Objects created with new BrowserView have the following properties:

view.webContents 实验性已弃用

¥view.webContents Experimental Deprecated

History
Version(s)Changes
None
API DEPRECATED

该视图拥有的 WebContents 对象。

¥A WebContents object owned by this view.

实例方法

¥Instance Methods

使用 new BrowserView 创建的对象具有以下实例方法:

¥Objects created with new BrowserView have the following instance methods:

view.setAutoResize(options) 实验性已弃用

¥view.setAutoResize(options) Experimental Deprecated

History
  • options 对象

    ¥options Object

    • width 布尔值(可选) - 如果是 true,视图的宽度将随着窗口一起增大和缩小。默认为 false

      ¥width boolean (optional) - If true, the view's width will grow and shrink together with the window. false by default.

    • height 布尔值(可选) - 如果是 true,视图的高度将随着窗口一起增大和缩小。默认为 false

      ¥height boolean (optional) - If true, the view's height will grow and shrink together with the window. false by default.

    • horizontal 布尔值(可选) - 如果是 true,视图的 x 位置和宽度将随窗口按比例增大和缩小。默认为 false

      ¥horizontal boolean (optional) - If true, the view's x position and width will grow and shrink proportionally with the window. false by default.

    • vertical 布尔值(可选) - 如果是 true,视图的 y 位置和高度将随窗口按比例增大和缩小。默认为 false

      ¥vertical boolean (optional) - If true, the view's y position and height will grow and shrink proportionally with the window. false by default.

view.setBounds(bounds) 实验性已弃用

¥view.setBounds(bounds) Experimental Deprecated

History
Version(s)Changes
None
API DEPRECATED

调整视图大小并将视图移动到相对于窗口提供的边界。

¥Resizes and moves the view to the supplied bounds relative to the window.

view.getBounds() 实验性已弃用

¥view.getBounds() Experimental Deprecated

History
Version(s)Changes
None
API DEPRECATED

返回 Rectangle

¥Returns Rectangle

此 BrowserView 实例的 boundsObject

¥The bounds of this BrowserView instance as Object.

view.setBackgroundColor(color) 实验性已弃用

¥view.setBackgroundColor(color) Experimental Deprecated

History
Version(s)Changes
None
API DEPRECATED
  • color 字符串 - Hex、RGB、ARGB、HSL、HSLA 或命名 CSS 颜色格式的颜色。对于十六进制类型,Alpha 通道是可选的。

    ¥color string - Color in Hex, RGB, ARGB, HSL, HSLA or named CSS color format. The alpha channel is optional for the hex type.

有效 color 值的示例:

¥Examples of valid color values:

  • 十六进制

    ¥Hex

    • #fff(RGB)

    • #ffff(ARGB)

    • #ffffff(RRGGBB)

    • #ffffffff(AARRGGBB)

  • RGB

    • rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)

      • 例如 rgb(255, 255, 255)

        ¥e.g. rgb(255, 255, 255)

  • RGBA

    • rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)

      • 例如 rgba(255, 255, 255, 1.0)

        ¥e.g. rgba(255, 255, 255, 1.0)

  • HSL

    • hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)

      • 例如 hsl(200, 20%, 50%)

        ¥e.g. hsl(200, 20%, 50%)

  • HSLA

    • hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)

      • 例如 hsla(200, 20%, 50%, 0.5)

        ¥e.g. hsla(200, 20%, 50%, 0.5)

  • 颜色名称

    ¥Color name

    • 选项列于 SkParseColor.cpp

      ¥Options are listed in SkParseColor.cpp

    • 与 CSS Color Module Level 3 关键字类似,但区分大小写。

      ¥Similar to CSS Color Module Level 3 keywords, but case-sensitive.

      • 例如 bluevioletred

        ¥e.g. blueviolet or red

注意:带 alpha 的十六进制格式采用 AARRGGBBARGB,而不是 RRGGBBAARGB

¥Note: Hex format with alpha takes AARRGGBB or ARGB, not RRGGBBAA or RGB.