Saltar al contenido principal

BrowserView

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

Se puede utilizar un BrowserView para incrustar contenido web adicional dentro de un BrowserWindow. Es como una ventana hija, excepto que su posición es relativa a la de su ventana propietaria. Se puede considerar como una alternativa al tag webview.

Clase: BrowserView

Crear y controlar vistas.

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

Proceso: principal</0>

Este módulo no puede ser usado hasta que el evento ready del módulo app es emitido.

Ejemplo

/// 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://electronjs.org')
})

new BrowserView([options]) Experimental Deprecated

  • options Object (opcional)
    • webPreferences WebPreferences (optional) - Settings of web page's features.
      • devTools boolean (opcional) - Si se habilita el DevTools. Si se configura a false, no puede utilizarse BrowserWindow.webContents.openDevTools() para abrir DevTools. Por defecto es true.
      • nodeIntegration boolean (optional) - Whether node integration is enabled. Por defecto es false.
      • nodeIntegrationInWorker boolean (opcional) - Si la integración de nodos está habilitada en los trabajadores de la web. Por defecto es false. Se pueden encontrar más detalles en Multithreading.
      • nodeIntegrationInSubFrames boolean (opcional) - Opcion experimental para habilitar soporte Node.js en sub-frames como iframes y ventas hijos. Todos tus preloads cargarán por cada iframe, puedes usar process.isMainFrame para determinar si estás en el marco principal o no.
      • preload string (opcional) - Especifica un script que será cargado antes del otros scripts en la página. Este script siempre tendrá acceso al nodo APIs sin importar si la integración de nodos esté activada o no. El valor debería ser la ruta del archivo absoluto al script. Cuando la integración de nodos esta desactivada, la precarga del script puede reintroducir de vuelta al ámbito global los símbolos globales del Nodo. Ver ejemplo aquí.
      • sandbox boolean (opcional) - Si se configura, protegerá al renderizador asociado a la ventana, haciéndolo compatible con el sandbox de Chromium OS-level, deshabilitando el motor Node.js. Esto no es lo mismo que la opción de nodeIntegration y las APIs disponibles para el script de precarga son más limitadas. Leer más sobre la opción aquí.
      • session Session (opcional) - Configura la sesión usada por la página. En lugar de pasar directamente el objeto de la sesión, se puede optar por utilizar la opción de partition, la cual acepta una cadena de partición. Cuando se proporcionen session y partition, se preferirá session. Default es la sesión por defecto.
      • partition cadena (opcional) - Configura la sesión utilizada por la página según la cadena de partición de la sesión. Si la partition empieza con persist:, la página utilizará una sesión persistente disponible para todas las páginas en la partición con la misma partition. Si no está el prefijo persist:, la página usara una sesión de la memoria interna. Al asignar la misma partition, las páginas múltiples pueden compartir la misma sesión. Default es la sesión por defecto.
      • zoomFactor number (optional) - The default zoom factor of the page, 3.0 represents 300%. Por defecto es 1.0.
      • javascript boolean (optional) - Enables JavaScript support. Por defecto es true.
      • webSecurity boolean (opcional) - Cuando es false, desactivará la política de same-origin (por lo general se utiliza cuando la gente prueba los sitios web), y configurará allowRunningInsecureContenta true en caso de que estas opciones no hayan sido configuradas por el usuario. Por defecto es true.
      • allowRunningInsecureContent boolean (optional) - Allow an https page to run JavaScript, CSS or plugins from http URLs. Por defecto es false.
      • images boolean (optional) - Enables image support. Por defecto es true.
      • imageAnimationPolicy string (opcional) - Especifica cómo correr la animaciones de la imagen (P.e. GIFs). Puede ser animate, animateOnce o noAnimation. Por defecto es animate.
      • textAreasAreResizable boolean (optional) - Make TextArea elements resizable. Default is true.
      • webgl boolean (optional) - Enables WebGL support. Por defecto es true.
      • plugins boolean (optional) - Whether plugins should be enabled. Por defecto es false.
      • experimentalFeatures boolean (optional) - Enables Chromium's experimental features. Por defecto es false.
      • scrollBounce boolean (optional) macOS - Enables scroll bounce (rubber banding) effect on macOS. Por defecto es false.
      • enableBlinkFeatures string (opcional) - Una lista de cadenas de características separadas por ,, para habilitar como CSSVariables,KeyboardEventKey. La lista completa de cadenas distintivas soportadas pueden encontrarse en el archivo RuntimeEnabledFeatures.json5.
      • disableblinkFeatures string (opcional) - Una lista de cadenas distintivas separadas por ,,como CSSVariables,KeyboardEventKey para deshabilitar. La lista completa de cadenas características soportadas puede ser encontrada en el archivo RuntimeEnabledFeatures.json5.
      • defaultFontFamily Object (optional) - Sets the default font for the font-family.
        • standard string (opcional) - Por defecto es Times New Roman.
        • serif string (opcional) - Por defecto es Times New Roman.
        • sansSerif string (opcional) - Por defecto es Arial.
        • monospace string (opcional) - Por defecto es Courier New.
        • cursive string (opcional) - Por defecto es Script.
        • fantasy string (opcional) - Por defecto es Impact.
        • math string (opcional) - Por defecto es Latin Modern Math.
      • defaultFontSize Integer (opcional) - Por defecto es 16.
      • defaultMonospaceFontSize Integer (opcional) - Por defecto es 13.
      • minimumFontSize Integer (opcional) - Por defecto es 0.
      • defaultEncoding string (opcional) - Por defecto es ISO-8859-1.
      • backgroundThrottling boolean (opcional) - Para acelerar animaciones y temporizadores cuando la página esta al fondo. Esto también afecta a 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. Por defecto es true.
      • offscreen boolean(optional) - Para habilitar el renderizado offscreen para el navegador de la ventana. Por defecto es false. Para más detalles, ver offscreen rendering tutorial.
      • contextIsolation boolean(opcional) - Para ejecutar las APIs de Electron y el script especificado preload en un contexto JavaScript independiente. Por defecto es 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. Esta opción utiliza la misa técnica usada por 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 boolean (opcional) - Si se habilita o no el <webview> tag. Por defecto es false. Nota: El script preload configurado para el <webview>tendrá la integración de nodos habilitada cuando se ejecuta por lo que hay que asegurarse que el contenido remoto o posiblemente dañino no sea capaz de crear una etiqueta de <webview>con un script preload posiblemente malicioso. Puede utilizarse el evento will-attach-webview en webContents para quitar el script preload y validar o alterar la configuración inicial de <webview>.
      • 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 boolean (optional) - Whether to enable browser style consecutive dialog protection. Por defecto es false.
      • safeDialogsMessage string (opcional) - El mensaje a mostrar cuando la protección de diálogo consecutivo es lanzada. So no se define el mensaje por defecto sería utilizado, note que actualmente el mensaje por defecto esta en Inglés y no localizado.
      • disableDialogs boolean (optional) - Whether to disable dialogs completely. Overrides safeDialogs. Por defecto es false.
      • navigateOnDragDrop boolean (optional) - Whether dragging and dropping a file or link onto the page causes a navigation. Por defecto es false.
      • autoplayPolicy string (opcional) - Política de autoplay para aplicar al contenido en la ventana, puede ser no-user-gesture-required, user-gesture-required, document-user-activation-required. Por defecto a no-user-gesture-required.
      • disableHtmlFullscreenWindowResize boolean (optional) - Whether to prevent the window from resizing when entering HTML Fullscreen. Default is false.
      • accessibleTitle string (optional) - An alternative title string provided only to accessibility tools such as screen readers. Esta cadena no es directamente visible para los usuarios.
      • spellcheck boolean (optional) - Whether to enable the builtin spellchecker. Por defecto es true.
      • enableWebSQL boolean (optional) - Whether to enable the WebSQL api. Por defecto es true.
      • v8CacheOptions string (optional) - Enforces the v8 code caching policy used by blink. Accepted values are
        • none - Disables code caching
        • code - Heuristic based code caching
        • bypassHeatCheck - Bypass code caching heuristics but with lazy compilation
        • bypassHeatCheckAndEagerCompile - Same as above except compilation is eager. Default policy is code.
      • 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. Por defecto es false.

Propiedades de la instancia

Los objetos creados con new BrowserView tienen las siguientes propiedades:

view.webContents Experimental Deprecated

Un objeto WebContents, que pertenece a esta vista.

Métodos de Instancia

Los objetos creados con new BrowserView tiene los siguientes métodos de instancia:

view.setAutoResize(options) Experimental Deprecated

  • options Object
    • width boolean (opcional) - Si es true, el ancho de la vista crecerá y se encogerá junto con la ventana. false por defecto.
    • height boolean (opcional) - Si es true, la altura de la vista crecerá y se encogerá junto con la ventana. false por defecto.
    • horizontal boolean (opcional) - Si es true, la posición x y el ancho de la vista crecerán y disminuirán proporcionalmente con la ventana. false por defecto.
    • vertical boolean (opcional) - Si es true, la posición y la altura de la vista crecerán y disminuirán proporcionalmente con la ventana. false por defecto.

view.setBounds(bounds) Experimental Deprecated

Redimensiona y mueve la vista a los limites proporcionados en relación a la ventana.

view.getBounds() Experimental Deprecated

Devuelve Rectangle

Los límites bounds de esta instancia de BrowserView como un Object.

view.setBackgroundColor(color) Experimental Deprecated

  • color string - Color en formato hexadecimal, RGB, ARGB, HSL, HSLA o en formato de color CSS nombrado. El canal alfa es opcional para el tipo hex.

Ejemplos de valores válidos de color:

  • Hex
    • #fff (RGB)
    • #ffff (ARGB)
    • #ffffff (RRGGBB)
    • #ffffffff (AARRGGBB)
  • RGB
    • rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)
      • p.e. rgb(255, 255, 255)
  • RGBA
    • rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)
      • p.e. rgba(255, 255, 255, 1.0)
  • HSL
    • hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)
      • p.e. hsl(200, 20%, 50%)
  • HSLA
    • hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)
      • p.e. hsla(200, 20%, 50%, 0.5)
  • Nombre de color
    • Las opciones se enumeran en SkParseColor.cpp
    • Similar a las palabras clave del Módulo de Color CSS Nivel 3, pero sensible a mayúsculas y minúsculas.
      • ej. blueviolet o red

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