跳到主内容

BrowserView

历史
版本变更
None
API DEPRECATED

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

BrowserView 可用于将附加 Web 内容嵌入 BrowserWindow 中。它类似于子窗口,不同之处在于它相对于其拥有窗口进行定位。它旨在替代 webview 标签。

类:BrowserView

历史
版本变更
None
API DEPRECATED

创建并控制视图。

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

进程:

此模块必须在 app 模块发出 ready 事件后才能使用。

示例

// 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.js.cn')
})

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

历史
版本变更
None
API DEPRECATED
  • options Object (可选)
    • webPreferences WebPreferences (可选) - 网页功能的设置。
      • devTools boolean (可选) - 是否启用 DevTools。如果设置为 false,则无法使用 BrowserWindow.webContents.openDevTools() 打开 DevTools。默认值为 true
      • nodeIntegration boolean (可选) - 是否启用 Node 集成。默认值为 false
      • nodeIntegrationInWorker boolean (可选) - 是否在 Web Worker 中启用 Node 集成。默认值为 false。更多信息请参见多线程
      • nodeIntegrationInSubFrames boolean (可选) - 实验性选项,用于在子框架(如 iframe 和子窗口)中启用 Node.js 支持。你的所有预加载脚本将为每个 iframe 加载,你可以使用 process.isMainFrame 来判断你是否在主框架中。
      • preload string (可选) - 指定一个脚本,该脚本将在页面中运行其他脚本之前加载。无论 Node 集成是否开启,此脚本始终可以访问 Node API。该值应为脚本的绝对文件路径。当 Node 集成关闭时,预加载脚本可以将 Node 全局符号重新引入全局范围。请参阅此处的示例。
      • sandbox boolean (可选) - 如果设置此选项,将沙箱化与窗口关联的渲染器,使其与 Chromium OS 级沙箱兼容并禁用 Node.js 引擎。这与 nodeIntegration 选项不同,预加载脚本可用的 API 也更有限。请在此处阅读有关该选项的更多信息。
      • session Session (可选) - 设置页面使用的会话。除了直接传递 Session 对象外,你也可以选择使用 partition 选项,该选项接受一个 partition 字符串。当同时提供 sessionpartition 时,将优先使用 session。默认为默认会话。
      • partition string (可选) - 根据会话的 partition 字符串设置页面使用的会话。如果 partitionpersist: 开头,页面将使用一个持久会话,该会话可供应用程序中具有相同 partition 的所有页面使用。如果没有 persist: 前缀,页面将使用内存会话。通过指定相同的 partition,多个页面可以共享同一个会话。默认为默认会话。
      • zoomFactor number (可选) - 页面的默认缩放因子,3.0 代表 300%。默认值为 1.0
      • javascript boolean (可选) - 启用 JavaScript 支持。默认值为 true
      • webSecurity boolean (可选) - 当为 false 时,它将禁用同源策略(通常用于测试网站),如果用户未设置此选项,则将 allowRunningInsecureContent 设置为 true。默认值为 true
      • allowRunningInsecureContent boolean (可选) - 允许 HTTPS 页面运行来自 HTTP URL 的 JavaScript、CSS 或插件。默认值为 false
      • images boolean (可选) - 启用图像支持。默认值为 true
      • imageAnimationPolicy string (可选) - 指定如何运行图像动画(例如 GIF)。可为 animate(动画)、animateOnce(仅动画一次)或 noAnimation(无动画)。默认值为 animate
      • textAreasAreResizable boolean (可选) - 使 TextArea 元素可调整大小。默认值为 true
      • webgl boolean (可选) - 启用 WebGL 支持。默认值为 true
      • plugins boolean (可选) - 是否应启用插件。默认值为 false
      • experimentalFeatures boolean (可选) - 启用 Chromium 的实验性功能。默认值为 false
      • scrollBounce boolean (可选) macOS - 在 macOS 上启用滚动回弹(橡皮筋)效果。默认值为 false
      • enableBlinkFeatures string (可选) - 由 , 分隔的功能字符串列表,如 CSSVariables,KeyboardEventKey,用于启用功能。支持的功能字符串的完整列表可在 RuntimeEnabledFeatures.json5 文件中找到。
      • disableBlinkFeatures string (可选) - 由 , 分隔的功能字符串列表,如 CSSVariables,KeyboardEventKey,用于禁用功能。支持的功能字符串的完整列表可在 RuntimeEnabledFeatures.json5 文件中找到。
      • defaultFontFamily Object (可选) - 为 font-family 设置默认字体。
        • standard string (可选) - 默认为 Times New Roman
        • serif string (可选) - 默认为 Times New Roman
        • sansSerif string (可选) - 默认为 Arial
        • monospace string (可选) - 默认为 Courier New
        • cursive string (可选) - 默认为 Script
        • fantasy string (可选) - 默认为 Impact
        • math string (可选) - 默认为 Latin Modern Math
      • defaultFontSize Integer (可选) - 默认为 16
      • defaultMonospaceFontSize Integer (可选) - 默认为 13
      • minimumFontSize Integer (可选) - 默认为 0
      • defaultEncoding string (可选) - 默认为 ISO-8859-1
      • backgroundThrottling boolean (可选) - 页面进入后台时是否限制动画和计时器。这也影响 Page Visibility API。当在单个 browserWindow 中显示的至少一个 webContents 禁用了 backgroundThrottling 时,整个窗口及其显示的其他 webContents 将绘制和交换帧。默认为 true
      • offscreen Object | boolean (可选) - 是否为浏览器窗口启用离屏渲染。默认为 false。有关更多详细信息,请参见离屏渲染教程
        • useSharedTexture boolean (可选) 实验性 - 是否使用 GPU 共享纹理进行加速绘制事件。默认为 false。有关更多详细信息,请参见离屏渲染教程
      • contextIsolation boolean (可选) - 是否在单独的 JavaScript 上下文中运行 Electron API 和指定的 preload 脚本。默认为 truepreload 脚本运行的上下文只能访问其自身的专属 documentwindow 全局对象,以及其自身的 JavaScript 内置对象(ArrayObjectJSON 等),这些对于加载的内容都是不可见的。Electron API 将仅在 preload 脚本中可用,而不在加载的页面中。加载可能不受信任的远程内容时应使用此选项,以确保加载的内容无法篡改 preload 脚本和正在使用的任何 Electron API。此选项使用与 Chrome 内容脚本使用的技术相同。你可以通过在 Console 选项卡顶部的组合框中选择“Electron Isolated Context”条目来在 DevTools 中访问此上下文。
      • webviewTag boolean (可选) - 是否启用 <webview> 标签。默认为 false注意:<webview> 配置的 preload 脚本在执行时将启用 Node 集成,因此应确保远程/不受信任的内容无法使用可能恶意设计的 preload 脚本创建 <webview> 标签。你可以在 webContents 上使用 will-attach-webview 事件来去除 preload 脚本并验证或修改 <webview> 的初始设置。
      • additionalArguments string[] (可选) - 将附加到此应用程序渲染器进程中的 process.argv 的字符串列表。对于将少量数据传递给渲染进程预加载脚本很有用。
      • safeDialogs boolean (可选) - 是否启用浏览器风格的连续对话框保护。默认值为 false
      • safeDialogsMessage string (可选) - 触发连续对话框保护时显示的消息。如果未定义,将使用默认消息,请注意当前默认消息为英文且未本地化。
      • disableDialogs boolean (可选) - 是否完全禁用对话框。此选项会覆盖 safeDialogs。默认值为 false
      • navigateOnDragDrop boolean (可选) - 将文件或链接拖放到页面上是否导致导航。默认值为 false
      • autoplayPolicy string (可选) - 应用于窗口中内容的自动播放策略,可以是 no-user-gesture-required(无需用户手势)、user-gesture-required(需要用户手势)或 document-user-activation-required(需要文档用户激活)。默认为 no-user-gesture-required
      • disableHtmlFullscreenWindowResize boolean (可选) - 进入 HTML 全屏时是否阻止窗口调整大小。默认值为 false
      • accessibleTitle string (可选) - 仅提供给屏幕阅读器等辅助工具的替代标题字符串。此字符串用户不可直接见。
      • spellcheck boolean (可选) - 是否启用内置拼写检查器。默认值为 true
      • enableWebSQL boolean (可选) - 是否启用 WebSQL API。默认值为 true
      • v8CacheOptions string (可选) - 强制使用 blink 使用的 v8 代码缓存策略。接受的值有
        • none - 禁用代码缓存
        • code - 基于启发式的代码缓存
        • bypassHeatCheck - 绕过代码缓存启发式,但采用惰性编译
        • bypassHeatCheckAndEagerCompile - 与上面相同,只是编译是即时进行的。默认策略是 code
      • enablePreferredSizeMode boolean (可选) - 是否启用首选大小模式。首选大小是包含文档布局所需的最小尺寸,无需滚动。启用此模式后,当首选大小发生变化时,将在 WebContents 上发出 preferred-size-changed 事件。默认值为 false
      • transparent boolean (可选) - 是否启用访客页面的背景透明。默认值为 true注意:访客页面的文本和背景颜色源自其根元素的颜色方案。启用透明时,文本颜色仍会相应变化,但背景将保持透明。
      • enableDeprecatedPaste boolean (可选) 已弃用 - 是否启用 paste execCommand。默认值为 false
      • enableCornerSmoothingCSS boolean (可选) 实验性 - 是否启用 -electron-corner-smoothing CSS 规则。默认值为 true

实例属性

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

view.webContents 实验性 已弃用

历史
版本变更
None
API DEPRECATED

此视图拥有的 WebContents 对象。

实例方法

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

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

历史
  • options Object
    • width boolean (可选) - 如果为 true,则视图的宽度将随窗口一起增长和缩小。默认为 false
    • height boolean (可选) - 如果为 true,则视图的高度将随窗口一起增长和缩小。默认为 false
    • horizontal boolean (可选) - 如果为 true,则视图的 x 位置和宽度将随窗口按比例增长和缩小。默认为 false
    • vertical boolean (可选) - 如果为 true,则视图的 y 位置和高度将随窗口按比例增长和缩小。默认为 false

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

历史
版本变更
None
API DEPRECATED

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

view.getBounds() 实验性 已弃用

历史
版本变更
None
API DEPRECATED

返回 Rectangle

此 BrowserView 实例的 bounds,格式为 Object

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

历史
版本变更
None
API DEPRECATED
  • color string - 十六进制、RGB、ARGB、HSL、HSLA 或命名 CSS 颜色格式的颜色。十六进制类型的 alpha 通道是可选的。

有效 color 值的示例

  • 十六进制
    • #fff (RGB)
    • #ffff (ARGB)
    • #ffffff (RRGGBB)
    • #ffffffff (AARRGGBB)
  • RGB
    • rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)
      • 例如 rgb(255, 255, 255)
  • RGBA
    • rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)
      • 例如 rgba(255, 255, 255, 1.0)
  • HSL
    • hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)
      • 例如 hsl(200, 20%, 50%)
  • HSLA
    • hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)
      • 例如 hsla(200, 20%, 50%, 0.5)
  • 颜色名称
    • 选项列在 SkParseColor.cpp
    • 类似于 CSS Color Module Level 3 关键字,但区分大小写。
      • 例如 bluevioletred

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