webContents

Procesamiento y control de páginas webs.

webContents es un EventEmitter. Es responsable de renderizar y controlar una página web y es una propiedad del objeto BrowserWindow. Un ejemplo de acceso al objeto webContents:

const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('http://github.com')

const contents = win.webContents
console.log(contents)

Métodos

Se pueden acceder a estos métodos desde el módulo webContents:

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

`webContents.getAllWebContents()`

Volver WebContents[] a la matriz de todo el caso WebContents. Esto incluirá contenido web para todos los windows, páginas web, devtools abiertos y extensión de páginas de origen devtools.

`webContents.getFocusedWebContents()`

Returns WebContents | null - The web contents that is focused in this application, otherwise returns null.

`webContents.fromId(id)`

id Íntegro

Devuelve WebContents | undefined - Una instancia de WebContents con el ID dado, o undefined si no hay WebContents asociados con ID dado.

`webContents.fromDevToolsTargetId(targetId)`

targetId string - The Chrome DevTools Protocol TargetID associated with the WebContents instance.

Returns WebContents | undefined - A WebContents instance with the given TargetID, or undefined if there is no WebContents associated with the given TargetID.

When communicating with the Chrome DevTools Protocol, it can be useful to lookup a WebContents instance based on its assigned TargetID.

async function lookupTargetId (browserWindow) {
  const wc = browserWindow.webContents
  await wc.debugger.attach('1.3')
  const { targetInfo } = await wc.debugger.sendCommand('Target.getTargetInfo')
  const { targetId } = targetInfo
  const targetWebContents = await webContents.fromDevToolsTargetId(targetId)
}

Clase: WebContents

Renderice y controle el contenido de una instancia de BrowserWindow.

Proceso: Main
Esta clase no está exportada desde el módulo 'electron'. Sólo está disponible como un valor de retorno de otros métodos en la API de Electron.

Eventos de Instancia

Evento: 'did-finish-load'

Emite cuando la navegación está hecha, i.e.

Evento: 'did-fail-load'

Devuelve:

event
errorCode Integer
errorDescription string
validatedURL string
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Este evento es como did-finish-load pero emitido cuando falló la carga. La lista completa de los códigos de error y su significado está disponible aquí.

Evento: 'did-fail-provisional-load'

Devuelve:

event
errorCode Integer
errorDescription string
validatedURL string
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Este evento es como did-fail-load pero emitido cuando la carga fue cancelada (p. e. fue invocado window.stop()).

Evento: 'did-frame-finish-load'

Devuelve:

event
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emite cuando un frame ha terminado la navegación.

Evento: 'did-start-loading'

Corresponde a los puntos en el tiempo cuando el girador de la pestaña comenzó a girar.

Evento: 'did-stop-loading'

Corresponde a los puntos en tiempo cuando el girador del tabulador terminó de girar.

Evento: 'dom-ready'

Devuelve:

event

Emitido cuando el documento el el nivel superior está cargado.

Evento: 'page-title-updated'

Devuelve:

event
title string
explicitSet boolen

Disparado cuando el título de la página se configura durante la navegación. explicitSet es false cuando el título es sincronizado desde el archivo url.

Evento: 'page-favicon-updated'

Devuelve:

event
favicons string[] - matriz de URLs.

Emite cuando la página recibe urls de favicon.

Evento: 'new-window' Deprecated

Devuelve:

event NewWindowWebContentsEvent
url string
frameName string
disposition string - Puede ser default, foreground-tab, background-tab, new-window, save-to-disk and other.
options BrowserWindowConstructorOptions - Las opciones que serán usadas para crear la nueva BrowserWindow.
additionalFeatures string[] - The non-standard features (features not handled by Chromium or Electron) given to window.open(). Deprecated, and will now always be the empty array [].
referrer Referrer - El remitente que será pasado a la nueva ventana. Puede resultar o no en la cabecera Referer siendo enviado, dependiendo de la política de referencia.
postBody PostBody (opcional) - Los datos que serán enviados a la nueva ventana, junto con las cabeceras apropiadas que se establecerán. Si no hay datos para enviar, el valor será null. Solo se define cuando la ventana está siendo creada por un formulario que establece target=_blank.

Obsoleto a favor de webContents.setWindowOpenHandler.

Emitido cuando la página solicita abrir una nueva ventana para una url. Puede ser requerido por window.open o un link externo como <a target='_blank'>.

Por defecto se creará un nuevo BrowserWindow para la dirección url.

Ejecutar event.preventDefault() evitará que Electron cree automáticamente un nuevo BrowserWindow. Si se llama a event.preventDefault() y se crea manualmente un nuevo BrowserWindow entonces se debe activar event.newGuest para referenciar a la nueva instancia de BrowserWindow, no hacerlo puede causar un comportamiento inesperado. Por ejemplo:

myBrowserWindow.webContents.on('new-window', (event, url, frameName, disposition, options, additionalFeatures, referrer, postBody) => {
  event.preventDefault()
  const win = new BrowserWindow({
    webContents: options.webContents, // use existing webContents if provided
    show: false
  })
  win.once('ready-to-show', () => win.show())
  if (!options.webContents) {
    const loadOptions = {
      httpReferrer: referrer
    }
    if (postBody != null) {
      const { data, contentType, boundary } = postBody
      loadOptions.postData = postBody.data
      loadOptions.extraHeaders = `content-type: ${contentType}; boundary=${boundary}`
    }

    win.loadURL(url, loadOptions) // existing webContents will be navigated automatically
  }
  event.newGuest = win
})

Evento: 'did-create-window'

Devuelve:

window Navegador Windows
details Object
- url string - URL for the created window.
- frameName string - Name given to the created window in the window.open() call.
- options BrowserWindowConstructorOptions - Las opciones utilizadas para crear el BrowserWindow. They are merged in increasing precedence: parsed options from the features string from window.open(), security-related webPreferences inherited from the parent, and options given by webContents.setWindowOpenHandler. Las opciones no reconocidas no están filtradas.
- referrer Referrer - El remitente que será pasado a la nueva ventana. Puede resultar o no en la cabecera Referer siendo enviado, dependiendo de la política de referencia.
- postBody PostBody (optional) - The post data that will be sent to the new window, along with the appropriate headers that will be set. Si no hay datos para enviar, el valor será null. Only defined when the window is being created by a form that set target=_blank.
- disposition string - Can be default, foreground-tab, background-tab, new-window, save-to-disk and other.

Emitted after successful creation of a window via window.open in the renderer. No emitido si la creación de la ventana es cancelada desde webContents.setWindowOpenHandler.

See window.open() for more details and how to use this in conjunction with webContents.setWindowOpenHandler.

Evento: 'will-navigate'

Devuelve:

event
url string

Emitido cuando un usuario o l página quiere empezar la navegación. Puede ocurrir cuando el objeto window.location se cambia o un usuario hace clic en un enlace en la página.

Este evento no se emitirá cuando la navegación es iniciada con programación con APIs como webContents.loadURL y webContents.back.

It is also not emitted for in-page navigations, such as clicking anchor links or updating the window.location.hash. Use did-navigate-in-page event for this purpose.

Llamando event.preventDefault() evitará la navegación.

Devuelve:

event
url string
isInPlace boolean
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emitido cuando cualquier frame (incluyendo el principal) comienza la navegación. isInPlace will be true for in-page navigations.

Evento: 'will-redirect'

Devuelve:

event
url string
isInPlace boolean
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emitted when a server side redirect occurs during navigation. For example a 302 redirect.

Este evento sera emitido después de did-start-navigation y siempre antes del evento did-redirect-navigation para la misma navegación.

Llamar a event.preventDefault() evitará la navegación (no solo la redirección).

Devuelve:

event
url string
isInPlace boolean
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emitted after a server side redirect occurs during navigation. For example a 302 redirect.

Este evento no puede ser prevenir. Si quieres prevenir redirecciones deber ver el evento will-redirect arriba.

Evento: 'did-navigate'

Devuelve:

event
url string
httpResponseCode Integer - -1 para navegaciones no HTTP
httpStatusText string - empty for non HTTP navigations

Emitido cuando se realizo un navegación del frame principal.

This event is not emitted for in-page navigations, such as clicking anchor links or updating the window.location.hash. Use did-navigate-in-page event for this purpose.

Evento: 'did-frame-navigate'

Devuelve:

event
url string
httpResponseCode Integer - -1 para navegaciones no HTTP
httpStatusText string - vacío para navegaciones no HTTP,
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emitido cuando se ha realizado un navegación de algun frame.

This event is not emitted for in-page navigations, such as clicking anchor links or updating the window.location.hash. Use did-navigate-in-page event for this purpose.

Evento: 'did-navigate-in-page'

Devuelve:

event
url string
isMainFrame boolean
frameProcessId Integer
frameRoutingId Integer

Emitido cuando se produjo una navegación en la página en cualquier frame.

Cuando una navegación dentro de la página sucede, el URL de la página cambia, pero no causa una navegación fuera de la página. Ejemplos de ésto ocurriendo son cuando los links son clickeados o cuando el evento DOM hashchange es activado.

Evento: 'will-prevent-unload'

Devuelve:

event

Emite cuando un controlador de eventos beforeunload está tratando de cancelar una descarga de la página.

Llamando a event.preventDefault() ignorará el controlador de eventos beforeunload y permite que la página sea descargada.

const { BrowserWindow, dialog } = require('electron')
const win = new BrowserWindow({ width: 800, height: 600 })
win.webContents.on('will-prevent-unload', (event) => {
  const choice = dialog.showMessageBoxSync(win, {
    type: 'question',
    buttons: ['Leave', 'Stay'],
    title: 'Do you want to leave this site?',
    message: 'Changes you made may not be saved.',
    defaultId: 0,
    cancelId: 1
  })
  const leave = (choice === 0)
  if (leave) {
    event.preventDefault()
  }
})

Note: This will be emitted for BrowserViews but will not be respected - this is because we have chosen not to tie the BrowserView lifecycle to its owning BrowserWindow should one exist per the specification.

Evento: 'crashed' Obsoleto

Devuelve:

event
killed boolean

Emitido cuando el proceso se crashea o es terminado.

Obsoleto: Este evento es reemplazado por el evento render-process-gone el cual contiene más información acerca de porque desapareció el renderer process. No siempre se debe a que haya dejado de funcionar. El booleano killed puede ser reemplazado al comprobar que reason === 'killed' cuando se cambie a ese evento.

Evento: 'render-process-gone'

Devuelve:

event
details Object
- reason string - The reason the render process is gone. Posibles valores:
  - clean-exit -El proceso ha finalizado con un exit code de cero
  - abnormal-exit - El proceso a finalizado con un exit code distinto de cero
  - killed - El proceso a enviado un SIGTERM o se a finalizado externamente
  - crashed - El proceso crasheo
  - oom - El proceso se quedo sin memoria
  - launch-failed - El proceso nunca se ha ejecutado correctamente
  - integrity-failure - las verificaciones de integridad de código de Windows fallaron
- exitCode Integer - El código de salida del proceso, a menos que reason sea launch-failed, en cuyo caso exitCode será un código de error de ejecución especifico de la plataforma.

Emitido cuando el renderer process desaparece inesperadamente. Esto se debe comúnmente porque se crasheo o cerro.

Evento: "unresponsive"

Aparece cuando la página web deja de responder.

Evento: "responsive"

Aparece cuando la página web que no responde vuelve a responder.

Evento: 'plugin-crashed'

Devuelve:

event
name string
version cadena

Emitido cuando el proceso de enchufe se ha caído.

Evento: 'destroyed'

Emitido cuando webContents es destruido.

Evento: 'before-input-event'

Devuelve:

event
input Object - Input properties.
- type string - Sea keyUp o keyDown.
- key string - Es igual a KeyboardEvent.key.
- code string - Es igual a KeyboardEvent.code.
- isAutoRepeat boolean - Es igual a KeyboardEvent.repeat.
- isComposing boolean - Equivalente a KeyboardEvent.isComposing.
- shift boolean - Es igual a KeyboardEvent.shiftKey.
- control boolean - Es igual a KeyboardEvent.controlKey.
- alt boolean - Es igual a KeyboardEvent.altKey.
- meta boolean - Es igual a KeyboardEvent.metaKey.
- location number - Equivalente a KeyboardEvent.location.
- modifiers string[] - Ver InputEvent.modifiers.

Emitido antes de enviar los eventos keydown y keyup en la página. Llamando a event.preventDefault evitará la página keydown/ eventos keyup y los accesos rápidos al menú.

To only prevent the menu shortcuts, use setIgnoreMenuShortcuts:

const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ width: 800, height: 600 })

win.webContents.on('before-input-event', (event, input) => {
  // For example, only enable application menu keyboard shortcuts when
  // Ctrl/Cmd are down.
  win.webContents.setIgnoreMenuShortcuts(!input.control && !input.meta)
})

Evento: "enter-html-full-screen"

Aparece cuando la ventana entra en un estado pantalla completa activado por la API HTML.

Evento: "leave-html-full-screen"

Aparece cuando la ventana sale de un estado pantalla completa activado por la API HTML.

Evento: 'zoom-changed'

Devuelve:

event
zoomDirection string - Puede ser in o out.

Emitido cuando es usuario esta solicitando cambiar el nivel del zoom usando la rueda del ratón.

Evento: "blur"

Emitted when the WebContents loses focus.

Evento: "focus"

Emitted when the WebContents gains focus.

Note that on macOS, having focus means the WebContents is the first responder of window, so switching focus between windows would not trigger the focus and blur events of WebContents, as the first responder of each window is not changed.

The focus and blur events of WebContents should only be used to detect focus change between different WebContents and BrowserView in the same window.

Evento: 'devtools-opened'

Emitido cuando DevTools es abierto.

Evento: 'devtools-closed'

Emitido cuando Devtools es cerrado.

Evento: 'devtools-focused'

Emitido cuando DevTools es centrado o abierto.

Evento: 'certificate-error'

Devuelve:

event
url string
error cadena - el error del código.
certificate certificate
callback Función
- isTrusted boolean - indica si el certificado se puede considerar de confianza.
isMainFrame boolean

Emitido cuando no se pudo verificar el certificate for url.

El uso es el mismo con the certificate-error evento de app.

Evento: 'select-client-certificate'

Devuelve:

event
url URL
certificateListCertificate[]
callback Función
- certificateCertificate - Debe ser un certificado de la lista dada.

Emitido cuando el certificado de un cliente es requerido.

El uso es el mismo con the select-client-certificate evento de app.

Evento:'login'

Devuelve:

event
authenticationResponseDetails Object
- url URL
authInfo Object
- isProxy boolean
- scheme string
- host string
- puerto Íntegro
- realm string
callback Función
- username string (optional)
- password string (optional)

Emitido cuando webContents quiere hacer una autenticación básica.

El uso es lo mismo que con el evento the login de la app.

Evento: 'found-in-page'

Devuelve:

event
result Object
- requestId Íntegro
- activeMatchOrdinal Integer - Posición de la coincidencia activa.
- matches Integer - Número de coincidencias.
- selectionArea Rectangle - Coordenadas de la primera región de coincidencia.
- finalUpdate boolean

Emitido cuando un resultado está disponible para la petición de [webContents.findInPage].

Evento: 'media-started-playing'

Emitido cuando la media empieza a reproducirse.

Evento: 'media-paused'

Emitido cuando la media es pausada o ha terminado de reproducirse.

Evento: 'did-change-theme-color'

Devuelve:

event
color (string | null) - Theme color is in format of '#rrggbb'. It is null when no theme color is set.

Emitted when a page's theme color changes. This is usually due to encountering a meta tag:

<meta name='theme-color' content='#ff0000'>

Evento: 'update-target-url'

Devuelve:

event
url string

Emitido cuando el mouse se mueve sobre un link o el teclado se mueve el concentrado a un link.

Evento: 'cursor-changed'

Devuelve:

event
type string
image NativeImage (opcional)
scale Float (optional) - scaling factor for the custom cursor.
size Size (opcional) - El tamaño de la image.
hotspot Point (opcional) - Coordenadas de la zona activa del cursor personalizado.

Emitido cuando el tipo del cursor cambia. El parámetro type puede ser default, crosshair, pointer, text, wait, help, e-resize, n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, w-resize, ns-resize, ew-resize, nesw-resize, nwse-resize, col-resize, row-resize, m-panning, e-panning, n-panning, ne-panning, nw-panning, s-panning, se-panning, sw-panning, w-panning, move, vertical-text, cell, context-menu, alias, progress, nodrop, copy, none, not-allowed, zoom-in, zoom-out, grab, grabbing or custom.

If the type parameter is custom, the image parameter will hold the custom cursor image in a NativeImage, and scale, size and hotspot will hold additional information about the custom cursor.

Devuelve:

event
params Object
- x Integer - x coordinate.
- y Integer - y coordinate.
- frame WebFrameMain - Frame desde el cual se invocó el menú contextual.
- linkURL string - URL del enlace que incluye el nodo del menú contextual que fue invocado.
- linkText string - Text associated with the link. May be an empty string if the contents of the link are an image.
- pageURL string - URL de la parte superior del nivel de la página que se invocó en el menú del contexto.
- framseURL string - URL de la parte inferior del marco que se invocó en el menú del contexto.
- srcURL string - Source URL for the element that the context menu was invoked on. Elements with source URLs are images, audio and video.
- mediaTipo string - Tipo de nodo que el menú del contexto fue invocado. Puede ser none, image, audio, video, canvas, file o plugin.
- <0>tieneImagenContenido boolean - si el menú del contexto fue invocado en una imagen la cual tiene contenido no vacío.
- esEditable boolean - Si el contexto es editable.
- selectrionText string. Texto de la selección la cual el menú del contexto fue invocado.
- titleText string - Ttexto del título de la selección en la que se invocó el menú contextual.
- altText string - Texto alternativo de la selección en la que se invocó el menú contextual.
- suggestedFilename string - Nombre de archivo sugerido para ser usado cuando se guarde el archivo a través de la opción 'Guarde Enlace Como' del menú contextual.
- selectionRect Rectángulo - Rectángulo que representa las coordenadas en el espacio del documento de la selección.
- SelectionStartOffset number - Posición inicial del texto de selección.
- referrerPolicy Referrer - La política de referencia del frame en el cual el menú es invocado.
- misspelledWord string - La palabra mal escrita bajo el cursor, si cualquiera.
- dictionarySuggestions string[] - Un array de palabras sugeridas para mostrar al usuario para remplazar el misspelledWord. Solo disponible si hay una palabra mal escrita y el corrector está habilitado.
- frameCharset string - La codificación de carácteres de la estructura la cual el menú fue invocado.
- inputFieldType cadena - Si se invoca el menú de contexto en un campo de entrada, el tipo de ese campo. Los valores posibles son none, plainText, password, other.
- spellcheckEnabled boolean - Si el contexto es editable, si el corrector ortográfico está habilitado o no.
- menuSourceType string - Input source that invoked the context menu. Puede ser none, mouse, keyboard, touch, touchMenu, longPress, longTap, touchHandle, stylus, adjustSelection, o adjustSelectionReset.
- mediaFlags Object - The flags for the media element the context menu was invoked on.
  - enError boolean - Si el elemento multimedia se ha dañado.
  - estáPausado boolean - Si el elemento multimedia está pausado.
  - estáSilenciado boolean - Si el elemento multimedia está silenciado.
  - tieneAudio boolean - Si el elemento multimedia tiene audio.
  - estáLooping boolean - Si el elemento multimedia está enredado.
  - esControlVisible boolean - Si los controles del elemento multimedia son visibles.
  - puedeToggleControles boolean - Si los controles de los elementos multimedia son toggleable.
  - canPrint boolean - Si el elemento multimedia puede ser impreso.
  - canSave boolean - Si el elemento multimedia puede ser descargado o no.
  - canShowPictureInPicture boolean - Si el elemento multimedia puede ser mostrado en picture-in-picture.
  - isShowingPictureInPicture boolean - Si el elemento multimedia está siendo actualmente mostrado en picture-in-picture.
  - puedeRotar boolean - Si el elemento multimedia puede ser rotado.
  - canLoop boolean - Si el elemento multimedia puede hacer un loop.
- editFlags Object - These flags indicate whether the renderer believes it is able to perform the corresponding action.
  - canUndo boolean - Si cree que el procesador puede deshacer.
  - canRedo boolean - Si cree que el procesador pueda rehacer.
  - canCut boolean - Si cree que el procesador puede cortar.
  - canCopy boolean - Si cree que el procesador puede copiar.
  - canPaste boolean - Si cree que el procesador puede pegar.
  - canDelete boolean - Si cree que el procesador puede borrar.
  - canSelectAll boolean - Si cree que el procesador puede seleccionar todo.
  - canEditRichly boolean - Si el renderer cree que puede editar texto de forma enriquecedora.

Emitido cuando hay un nuevo menú de contexto que debe ser manejado.

Evento: 'select-bluetooth-device'

Devuelve:

event
devices BluetoothDevice[]
callback Función
- deviceId string

Emite cuando el dispositivo bluetooth necesita ser seleccionado en la llamada navigator.bluetooth.requestDevice. Para usar navigator.bluetooth api webBluetooth debe ser activada. Si no se llama event.preventDefault el primer dispositivo disponible será seleccionado. callback puede ser llamado con deviceId ser seleccionado,.

If no event listener is added for this event, all bluetooth requests will be cancelled.

const { app, BrowserWindow } = require('electron')

let win = null
app.commandLine.appendSwitch('enable-experimental-web-platform-features')

app.whenReady().then(() => {
  win = new BrowserWindow({ width: 800, height: 600 })
  win.webContents.on('select-bluetooth-device', (event, deviceList, callback) => {
    event.preventDefault()
    const result = deviceList.find((device) => {
      return device.deviceName === 'test'
    })
    if (!result) {
      callback('')
    } else {
      callback(result.deviceId)
    }
  })
})

Evento: 'paint'

Devuelve:

event
dirtyRect Rectangle
image NativeImage - La información de la imagen de todo el fotograma.

Emitted when a new frame is generated. Only the dirty area is passed in the buffer.

const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ webPreferences: { offscreen: true } })
win.webContents.on('paint', (event, dirty, image) => {
  // updateBitmap(dirty, image.getBitmap())
})
win.loadURL('http://github.com')

Evento: 'devtools-reload-page'

Emitido cuando la ventana devtools instruya la webContents para recargar

Evento: 'will-attach-webview'

Devuelve:

event
webPreferences WebPreferences - The web preferences that will be used by the guest page. This object can be modified to adjust the preferences for the guest page.
params Record<string, string> - The other <webview> parameters such as the src URL. This object can be modified to adjust the parameters of the guest page.

Emitted when a <webview>'s web contents is being attached to this web contents. Calling event.preventDefault() will destroy the guest page.

Este evento puede utilizarse para configurar webPreferences para la webContents de un <webview>antes de que se carga y proporciona la capacidad de configuración que no se puede establecer a través de atributos <webview>.

Event: 'did-attach-webview'

Devuelve:

event
webContents WebContents - El contenido de la página web invitada que será usado por <webview>.

Emitido cuando se ha adjuntado un <webview> a este contenido web.

Evento: 'console-message'

Devuelve:

event
level Entero - El nivel de registro, desde 0 hasta 3. In order it matches verbose, info, warning and error.
message string - The actual console message
line Entero - El número de línea de la fuente que activó este mensaje de consola
sourceId cadena

Emitido cuando la ventana asociada registra un mensaje de consola.

Evento: 'error-preload'

Devuelve:

event
preloadPath string
error Error

Emitido cuando el script de preload preloadPathlanza una excepción no manejada error.

Evento: 'ipc-message'

Devuelve:

event
channel cadena
...args any[]

Emitido cuando el proceso de renderizado enviá un mensaje asíncrono a través de ipcRenderer.send().

Evento: 'ipc-message-sync'

Devuelve:

event
channel cadena
...args any[]

Emitido cuando el proceso de renderizado envía un mensaje sincronídico a través de ipcRenderer.sendSync().

Evento: 'preferred-size-changed'

Devuelve:

event
preferredSize Size - The minimum size needed to contain the layout of the document—without requiring scrolling.

Emitted when the WebContents preferred size has changed.

This event will only be emitted when enablePreferredSizeMode is set to true in webPreferences.

Evento: 'frame-created'

Devuelve:

event
details Object
- frame WebFrameMain

Emitido cuando el mainFrame, un <iframe>, o un anidado <iframe> es cargado dentro de la página.

Métodos de Instancia

`contents.loadURL(url[, options])`

url string
options Object (opcional)
- httpReferrer (string | Referrer) (opcional) - Una url HTTP de referencia.
- userAgent string (opcional) - Un agente de usuario originando el pedido.
- extraHeaders string (opcional) - Cabeceras extras separadas por "\n".
- postData (UploadRawData | UploadFile)[] (optional)
- baseURLForDataURL string (opcional) - Url base (con separadores de ruta arrastrables) para archivos que se cargan por el url de datos. Esto es necesario únicamente si el url especificado es un url de datos y necesita cargar otros archivos.

Devuelve Promise<void> - la promesa se resolverá cuando la página ha finalizado de cargar (mira did-finish-load), y rechaza si la página falla al cargar (miradid-fail-load). Un manejador de rechazo noop ya esta adjunto, el cual evita errores de rechazo no controlados.

Carga el url en la ventana. El url debe contener el prefijo de protocolo. Por ejemplo http:// o file://. Si la carga debe omitir el caché http entonces hay que utilizar el encabezado pragma para lograrlo.

const { webContents } = require('electron')
const options = { extraHeaders: 'pragma: no-cache\n' }
webContents.loadURL('https://github.com', options)

`contents.loadFile(filePath[, options])`

filePath string
options Object (opcional)
- query Record<string, string> (optional) - Passed to url.format().
- search string (opcional) - Pasado a url.format().
- hash string (opcional) - Pasado a url.format().

Devuelve Promise<void> - la promesa sera resolvida cuando la página haya finalizado de cargar (mira did-finish-load), y será rechazada si la pagina falla al cargar (mira did-fail-load).

Loads the given file in the window, filePath should be a path to an HTML file relative to the root of your application. For instance an app structure like this:

| root
| - package.json
| - src
|   - main.js
|   - index.html

Requeriría un código como este

win.loadFile('src/index.html')

`contents.downloadURL(url)`

url string

Inicia una descarga del recurso en url sin navegar. The will-download event of session will be triggered.

`contents.getURL()`

Devuelve string - La URL de la página web actual.

const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('http://github.com').then(() => {
  const currentURL = win.webContents.getURL()
  console.log(currentURL)
})

`contents.getTitle()`

Devuelve string - El título de la página web actual.

`contents.isDestroyed()`

Devuelve boolean - Si la página web fue destruida o no.

`contents.focus()`

Enfoca la página web.

`contents.isFocused()`

Devuelve boolean - Si se enfocó o no la página web.

`contents.isLoading()`

Devuelve boolean - Si todavía la página web está cargando recursos.

`contents.isLoadingMainFrame()`

Devuelve boolean - Si el marco principal (y no sólo iframes o frames dentro de él) todavía está cargando.

`contents.isWaitingForResponse()`

Devuelve boolean - Si la página web espera una primera respuesta desde el recurso principal de la página.

`contents.stop()`

Detiene cualquier navegación pendiente.

`contents.reload()`

Recarga la página web actual.

`contents.reloadIgnoringCache()`

Recarga la página actual e ignora el caché.

`contents.canGoBack()`

Devuelve boolean - Si el navegador puede volver a la página web anterior.

`contents.canGoForward()`

Devuelve boolean - Si el navegador puede avanzar a la siguiente página web.

`contents.canGoToOffset(offset)`

offset Íntegro

Devuelve boolean - Si la página web puede ir a offset.

`contents.clearHistory()`

Borra el historial de navegación.

`contents.goBack()`

Hace que el navegador regrese a una página web.

`contents.goForward()`

Hace que el navegador avance a una página web.

`contents.goToIndex(index)`

index Íntegro

Navega al índice de página web absoluta especificado.

`contents.goToOffset(offset)`

offset Íntegro

Navega hacia el offset especificado desde "la entrada actual".

`contents.isCrashed()`

Devuelve boolean - Si el proceso de renderizado ha fallado.

`contents.forcefullyCrashRenderer()`

Forzosamente termina el renderer process que actualmente aloja este webContents. Esto hará que sea emitido el evento render-process-gone con el reason=killed || reason=crashed. Tenga en cuenta que algunos webContents comparten el renderer process y por lo tanto llamar a este método puede causar que se bloque el proceso también para otros wevContents.

Llamar a reload() inmediatamente después de llamar a este método forzará que la recarga ocurra en un nuevo proceso. Esto debería ser usado cuando el proceso es inestable o inutilizable, por ejemplo parar recuperar del evento unresponsive.

contents.on('unresponsive', async () => {
  const { response } = await dialog.showMessageBox({
    message: 'App X has become unresponsive',
    title: 'Do you want to try forcefully reloading the app?',
    buttons: ['OK', 'Cancel'],
    cancelId: 1
  })
  if (response === 0) {
    contents.forcefullyCrashRenderer()
    contents.reload()
  }
})

`contents.setUserAgent(userAgent)`

userAgent cadena

Anula el agente usuario para esta página web.

`contents.getUserAgent()`

Devuelve string - El agente usuario para esta página web.

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

css cadena
options Object (opcional)
- cssOrigin string (optional) - Can be either 'user' or 'author'. Sets the cascade origin of the inserted stylesheet. Default is 'author'.

Devuelve Promise<string> - Una promesa que resuelve con una llave para el CSS insertado que puede ser usado más tarde prar quitar el CSS vía contents.removeInsertedCSS(key).

Inyecta CSS en la página web actual y devuelve un identificador único para la hoja de estilo insertada.

contents.on('did-finish-load', () => {
  contents.insertCSS('html, body { background-color: #f00; }')
})

`contents.removeInsertedCSS(key)`

llave cadena

Devuelve Promise<void> - Resuelve si la eliminación fue exitosa.

Elimina el CSS insertado desde la página web actual. La hoja de estilos se identifica por su clave, el cual es devuelto desde contents.insertCSS(css).

contents.on('did-finish-load', async () => {
  const key = await contents.insertCSS('html, body { background-color: #f00; }')
  contents.removeInsertedCSS(key)
})

`contents.executeJavaScript(code[, userGesture])`

codigo string
userGesture boolean (opcional) - Predeterminado es falso.

Devuelve Promise<any> - Una promesa que resuelve con el resultado de la ejecución del código o es rechazada si el resultado del código es una promesa rechazada.

Evalúa el código en la página.

En la ventana del navegador, algunas API HTML como requestFullScreen solo pueden invocarse con un gesto del usuario. Establecer userGesture a true eliminará esta limitación.

La ejecución del código se suspenderá hasta que la página web deje de cargarse.

contents.executeJavaScript('fetch("https://jsonplaceholder.typicode.com/users/1").then(resp => resp.json())', true)
  .then((result) => {
    console.log(result) // Will be the JSON object from the fetch call
  })

`contents.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture])`

worldId Integer - El ID de la palabra para correr javascript en, 0 es el mundo por defecto, 999 es el mundo usado por la característica contextIsolation de Electron. Aquí puede suministrar cualquier entero.
scripts WebSource[]
userGesture boolean (opcional) - Predeterminado es falso.

Devuelve Promise<any> - Una promesa que resuelve con el resultado de la ejecución del código o es rechazada si el resultado del código es una promesa rechazada.

Funciona como executeJavaScript pero evaluá scripts en un contexto aislado.

`contents.setIgnoreMenuShortcuts(ignore)`

ignore boolean

Ignora los accesos directos del menú de la aplicación mientras se enfoca los contenidos de la web.

`contents.setWindowOpenHandler(handler)`

handler Function<{action: 'deny'} | {action: 'allow', overrideBrowserWindowOptions?: BrowserWindowConstructorOptions}>
- details Object
  - url string - La versión resuelta de la URL pasada a window.open(). por ejemplo una ventana con window.open('foo') producirá algo como https://the-origin/the/current/path/foo.
  - frameName string - Nombre de la ventana proporcionado en window.open()
  - features string - Lista separada por coma de la características de ventana proporcionada a window.open().
  - disposition string - Can be default, foreground-tab, background-tab, new-window, save-to-disk or other.
  - referrer Referrer - El remitente que será pasado a la nueva ventana. Puede resultar o no en la cabecera Referer siendo enviado, dependiendo de la política de referencia.
  - postBody PostBody (opcional) - Los datos que serán enviados a la nueva ventana, junto con las cabeceras apropiadas que se establecerán. Si no hay datos para enviar, el valor será null. Solo se define cuando la ventana está siendo creada por un formulario que establece target=_blank.
Devuelve {action: 'deny'} | {action: 'allow', overrideBrowserWindowOptions?: BrowserWindowConstructorOptions} - deny cancela la creación de la nueva ventana. allow permitirá la que se cree la nueva ventana. Especificando overrideBrowserWindowOptions permite la personalización de la ventana creada. Devolver un valor no reconocido como un null, undefined o un objeto sin una 'action' reconocida resultará en un error de consola tiene el mismo efecto que devolver {action: 'deny'}.

Llamado antes de crear una ventana un solicitud de nueva ventana es solicitada por el renderer, p.e. por window.open(), un enlace con target="_blank", shift+pulsando en un enlace, o enviando un formulario con <form target="_blank">. Ver window.open() Para más detalles y como usar esto en conjunción con did-create-window.

`contents.setAudioMuted(muted)`

muted boolean

Silencia el audio la página web actual.

`contents.isAudioMuted()`

Devuelve boolean - Si esta página ha sido silenciada.

`contents.isCurrentlyAudible()`

Devuelve boolean - Si el audio se esta reproduciendo actualmente.

`contents.setZoomFactor(factor)`

factor Double - Factor de zoom; por defecto es 1.0.

Cambia el nivel de zoom al nivel especificado. Factor de zoom es porcentaje de zoom dividido entre 100, así que 300% = 3.0.

El factor debe ser mayor que 0.0.

`contents.getZoomFactor()`

Devuelve number - el factor de zoom actual.

`contents.setZoomLevel(level)`

nivel número - Nivel de Zoom.

Cambia el nivel de zoom al nivel especificado. El tamaño original es 0 y cada incremento por encima o por debajo representa un zoom del 20% mayor o menor a los límites predeterminados de 300% y 50% del tamaño original, respectivamente. La fórmula para esto es scale := 1.2 ^ level.

NOTE: The zoom policy at the Chromium level is same-origin, meaning that the zoom level for a specific domain propagates across all instances of windows with the same domain. Differentiating the window URLs will make zoom work per-window.

`contents.getZoomLevel()`

Devuelve number - el nivel de zoom actual.

`contents.setVisualZoomLevelLimits(minimumLevel, maximumLevel)`

minimumLevel número
maximumLevel número

Devuelve Promise<void>

Establecer el nivel de máximo y mínimo pizca de zoom.

NOTE: Visual zoom is disabled by default in Electron. To re-enable it, call:
contents.setVisualZoomLevelLimits(1, 3)

`contents.undo()`

Ejecuta el comando de edición undo en la página web.

`contents.redo()`

Ejecuta el comando de edición redo en la página web.

`contents.cut()`

Ejecuta el comando de edición cut en la página web.

`contents.copy()`

Ejecuta el comando de edición copy en la página web.

`contents.copyImageAt(x, y)`

x Integer
y Integer

Copia la imagen en la posición determinada al portapapeles.

`contents.paste()`

Ejecuta el comando de edición paste en la página web.

`contents.pasteAndMatchStyle()`

Ejecuta el comando de edición pasteAndMatchStyle en la página web.

`contents.delete()`

Ejecuta el comando de edición delete en la página web.

`contents.selectAll()`

Ejecuta el comando de edición selectAll en la página web.

`contents.unselect()`

Ejecuta el comando de edición unselect en la página web.

`contents.replace(text)`

texto cadena

Ejecuta el comando de edición replace en la página web.

`contents.replaceMisspelling(text)`

texto cadena

Ejecuta el comando de edición replaceMisspelling en página web.

`contents.insertText(text)`

texto cadena

Devuelve Promise<void>

Inserta texto en el elemento enfocado.

`contents.findInPage(text[, options])`

text string - El contenido para ser buscado, no debe quedar en blanco.
options Object (opcional)
- forward boolean (opcional) - Ya sea para buscar hacia adelante o hacia atrás, el valor predeterminado es true.
- findNext boolean (optional) - Whether to begin a new text finding session with this request. Should be true for initial requests, and false for follow-up requests. Por defecto es false.
- matchCase boolean (opcional) - Si la busqueda debe ser sensible a mayúsculas, por defecto es false.

Devuelve Integer - El id de la solicitud usado para la solicitud.

Empieza una solicitud para encontrar todas las coincidencias para el text en la página web. El resultado de la solicitud puede ser obtenida suscribiendote al evento found-in-page.

`contents.stopFindInPage(action)`

action string - Specifies the action to take place when ending [webContents.findInPage] request.
- clearSelection - Borrar la selección.
- keepSelection - Traduce la selección en una selección normal.
- activateSelection - Enfoca y hace clic en el nodo de selección.

Detiene cualquier solicitud findInPage para el webContents con la action proporcionada.

const { webContents } = require('electron')
webContents.on('found-in-page', (event, result) => {
  if (result.finalUpdate) webContents.stopFindInPage('clearSelection')
})

const requestId = webContents.findInPage('api')
console.log(requestId)

`contents.capturePage([rect])`

rect Rectangle (opcional) - El área de la página para ser capturada.

Devuelve Promise<NativeImage> - Resuelve con el un NativeImage

Captura una foto instantánea de la página dentro de rect. Omitiendo rect capturará toda la página visible.

`contents.isBeingCaptured()`

Devuelve boolean - Si esta página está siendo capturada. Devuelve true cuando el recuento de capturadores es mas grande que 0.

`contents.incrementCapturerCount([size, stayHidden, stayAwake])`

size Tamaño (opcional) - El tamaño preferido para el capturador.
stayHidden boolean (opcional) - Mantiene la página oculta en lugar de visible.
stayAwake boolean (optional) - Keep the system awake instead of allowing it to sleep.

Incrementa el recuento del capturador en uno. La página se considera visible cuando su ventana de navegador está oculta y el recuento de captadores no es cero. Si desea que la página quede oculta, debería asegurarse que stayHidden está establecida a true.

Esto también afecta a la API de visibilidad de página.

`contents.decrementCapturerCount([stayHidden, stayAwake])`

stayHidden boolean (opcional) - Mantiene la página en estado oculto en lugar de visible.
stayAwake boolean (optional) - Keep the system awake instead of allowing it to sleep.

Disminuye el numero de de contador en uno. La página se establecerá al estado oculto u ocluido cuando la ventana de su navegador está oculta u ocluida y el recuento del capturador llegue a cero. Si quiere disminuir el contador de capturador en su lugar debería establecer stayHidden a true.

`contents.getPrinters()` Deprecated

Obtiene la lista de impresora del sistema.

Devuelve PrinterInfo[]

Deprecated: Use la nueva API de contents.getPrintersAsync.

`contents.getPrintersAsync()`

Obtiene la lista de impresora del sistema.

Returns Promise<PrinterInfo[]> - Resolves with a PrinterInfo[]

`contents.print([options], [callback])`

options Object (opcional)
- silent boolean (optional) - Don't ask user for print settings. Por defecto es false.
- printBackground boolean (optional) - Prints the background color and image of the web page. Por defecto es false.
- deviceName string (optional) - Set the printer device name to use. Must be the system-defined name and not the 'friendly' name, e.g 'Brother_QL_820NWB' and not 'Brother QL-820NWB'.
- color boolean (optional) - Set whether the printed web page will be in color or grayscale. Por defecto es true.
- margins Object (opcional)
  - marginType string (opcional) - Puede ser default, none, printableArea, o custom. Si custom es elegido, además necesitar especificar top, bottom, left, y right.
  - top number (opcional) - El margen superior de la página web impresa, en píxeles.
  - bottom number (opcional) - El margen inferior de la página web impresa, en píxeles.
  - left number (opcional) - El margen izquierdo de la página web impresa, en píxeles.
  - right number (opcional) - El margen derecho de la página web impresa, en píxeles.
- landscape boolean (optional) - Whether the web page should be printed in landscape mode. Por defecto es false.
- scaleFactor number (opcional) - El factor de escalado de la página web.
- pagesPerSheet number (opcional) - El número de páginas a imprimir por hoja de página.
- collate boolean (opcional) - Si la página web debe ser intercalada.
- copies number (opcional) - El número de copias de la página web a imprimir.
- pageRanges Object[] (optional) - The page range to print. On macOS, only one range is honored.
  - from number - Index of the first page to print (0-based).
  - to number - Índice de la última página a imprimir (inclusive) (0-based).
- duplexMode string (optional) - Set the duplex mode of the printed web page. Puede ser simplex, shortEdge, o longEdge.
- dpi Record<string, number> (optional)
  - horizontal number (opcional) - El dpi horizontal.
  - vertical number (opcional) - El dpi vertical.
- header string (opcional) - Cadena a ser impresa como cabecera de la página.
- footer string (opcional) - Cadena a ser impresa como pie de página.
- pageSize string | Tamaño (opcional) - Especifique el tamaño de página del documento impreso. Puede ser A3, A4, A5, Legal, Letter, Tabloid o un objeto que contenga height.
retrocallback Funcion (opcional)
- success boolean - Indica el éxito de la llamada impresa.
- failureReason string - Descripción del error llamada de nuevo si la impresión falla.

Cuando es pasado un pageSize personalizado, Chromium intenta validar los valores mínimos específicos de la plataforma para width_microns y height_microns. Ambos anchura y altura deben ser mínimamente 353 microns, pero puede ser más grande en algunos sistemas operativos.

Imprime la página web de la ventana. Cuando silent está establecido a true, Electron tomará la impresora predeterminada del sistema si deviceName está vacío y las configuraciones por defecto para imprimir.

Utilizar el estilo CCS page-break-before: always; para imprimir a la fuerza una página nueva.

Ejemplo de uso:

const options = {
  silent: true,
  deviceName: 'My-Printer',
  pageRanges: [{
    from: 0,
    to: 1
  }]
}
win.webContents.print(options, (success, errorType) => {
  if (!success) console.log(errorType)
})

`contents.printToPDF(options)`

options Object
- headerFooter Record<string, string> (optional) - the header and footer for the PDF.
  - title string - El título para el encabezado PDF.
  - url string - la url para el pie de página PDF.
- landscape boolean (opcional) - true para landscape, false para portrait.
- marginsType Integer (optional) - Specifies the type of margins to use. Uses 0 for default margin, 1 for no margin, and 2 for minimum margin.
- scaleFactor number (opcional) - El factor de escalado de la página web. Puede variar entre 0 to 100.
- pageRanges Record<string, number> (optional) - The page range to print.
  - from number - Index of the first page to print (0-based).
  - to number - Índice de la última página a imprimir (inclusive) (0-based).
- pageSize string | Size (opcional) - Especifique el tamaño de la pagina PDF generada. Can be A3, A4, A5, Legal, Letter, Tabloid or an Object containing height and width in microns.
- printBackground boolean (opcional) - Si va a imprimir los fondos CSS.
- printSelectionOnly boolean (opcional) - Si se va a imprimir solo la selección.

Returns Promise<Buffer> - Se resuelve cuando los datos PDF son generados.

Imprime la página web de la ventana como PDF con la configuración personalizada de impresión previa de Chromium.

El landscape se ignorará si @page CSS at-rule es utilizado en la página web.

Por defecto, una options en blanco se considerará como:

{
  marginsType: 0,
  printBackground: false,
  printSelectionOnly: false,
  landscape: false,
  pageSize: 'A4',
  scaleFactor: 100
}

Utilizar el estilo CCS page-break-before: always; para imprimir a la fuerza una página nueva.

Un ejemplo de webContents.printToPDF:

const { BrowserWindow } = require('electron')
const fs = require('fs')
const path = require('path')
const os = require('os')

const win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('http://github.com')

win.webContents.on('did-finish-load', () => {
  // Use default printing options
  const pdfPath = path.join(os.homedir(), 'Desktop', 'temp.pdf')
  win.webContents.printToPDF({}).then(data => {
    fs.writeFile(pdfPath, data, (error) => {
      if (error) throw error
      console.log(`Wrote PDF successfully to ${pdfPath}`)
    })
  }).catch(error => {
    console.log(`Failed to write PDF to ${pdfPath}: `, error)
  })
})

`contents.addWorkSpace(path)`

path string

Agrega la ruta especificada al workspace de DevTools. Debe ser usado después de la creación de DevTools:

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
win.webContents.on('devtools-opened', () => {
  win.webContents.addWorkSpace(__dirname)
})

`contents.removeWorkSpace(path)`

path string

Elimina la ruta especificada del espacio de trabajo de DevTools.

`contents.setDevToolsWebContents(devToolsWebContents)`

devToolsWebContents WebContents

Usa el devToolsWebContents como objetivo WebContents para mostrar devtools.

El devToolsWebContents no debe tener ninguna ninguna navegación, y este no debería ser usado para otros propósitos después de la llamada.

Por defecto Electron maneja el devtools creando un WebContents interno con un vista nativa, de lo cual los desarrolladores tienen un control muy limitado. Con el método setDevToolsWebContents, los desarrolladores pueden usar algún WebContents para mostrar el devtools en él, incluyendo la etiqueta BrowserWindow, BrowserView y <webview>.

Tenga en cuenta que cerrando el devtools no se destruye el devToolsWebContents, es responsabilidad del que llamo destruir el devToolsWebContents.

Un ejemplo de mostrar devtools en una etiqueta <webview>:

<html>
<head>
  <style type="text/css">
    * { margin: 0; }
    #browser { height: 70%; }
    #devtools { height: 30%; }
  </style>
</head>
<body>
  <webview id="browser" src="https://github.com"></webview>
  <webview id="devtools" src="about:blank"></webview>
  <script>
    const { ipcRenderer } = require('electron')
    const emittedOnce = (element, eventName) => new Promise(resolve => {
      element.addEventListener(eventName, event => resolve(event), { once: true })
    })
    const browserView = document.getElementById('browser')
    const devtoolsView = document.getElementById('devtools')
    const browserReady = emittedOnce(browserView, 'dom-ready')
    const devtoolsReady = emittedOnce(devtoolsView, 'dom-ready')
    Promise.all([browserReady, devtoolsReady]).then(() => {
      const targetId = browserView.getWebContentsId()
      const devtoolsId = devtoolsView.getWebContentsId()
      ipcRenderer.send('open-devtools', targetId, devtoolsId)
    })
  </script>
</body>
</html>

// Main process
const { ipcMain, webContents } = require('electron')
ipcMain.on('open-devtools', (event, targetContentsId, devtoolsContentsId) => {
  const target = webContents.fromId(targetContentsId)
  const devtools = webContents.fromId(devtoolsContentsId)
  target.setDevToolsWebContents(devtools)
  target.openDevTools()
})

Un ejemplo de mostrar devtools en un BrowserWindow:

const { app, BrowserWindow } = require('electron')

let win = null
let devtools = null

app.whenReady().then(() => {
  win = new BrowserWindow()
  devtools = new BrowserWindow()
  win.loadURL('https://github.com')
  win.webContents.setDevToolsWebContents(devtools.webContents)
  win.webContents.openDevTools({ mode: 'detach' })
})

`contents.openDevTools([options])`

options Object (opcional)
- mode string - Opens the devtools with specified dock state, can be left, right, bottom, undocked, detach. Por defecto se utiliza el último estado de dock. En el modo undocked es posible acoplarse de nuevo. En el modo detach no se puede.
- activate boolean (optional) - Whether to bring the opened devtools window to the foreground. El valor por defecto es true.

Abre las herramientas del desarrolador.

Cuando contents es un tag <webview>, el mode debería ser detach por defecto, explícitamente pasando un mode vacío puede forzar el uso del último estado del dock.

`contents.closeDevTools()`

Cierra las devtools.

`contents.isDevToolsOpened()`

Devuelve boolean - Si se abren las herramientas del desarrollador.

`contents.isDevToolsFocused()`

Devuelve boolean - Si se enfoca la vista de las herramientas del desarrollador .

`contents.toggleDevTools()`

Alterna las herramientas de desarrollador.

`contents.inspectElement(x, y)`

x Integer
y Integer

Empieza a inspeccionar elementos en la posición (x, y).

`contents.inspectSharedWorker()`

Abre las herramientas de desarrollador para el contexto de los trabajadores compartidos.

`contents.inspectSharedWorkerById(workerId)`

cadena workerId

Inspecciona el worker compartido basado en su ID.

`contents.getAllSharedWorkers()`

Devuelve SharedWorkerInfo[] - Información acerca de todos los Workers Compartidos.

`contents.inspectServiceWorker()`

Abre las herramientas de desarrollador para el contexto del trabajador de servicio.

`contents.send(channel, ...args)`

channel cadena
...args any[]

Envía un mensaje asíncrono al render process a través de channel, junto con los argumentos. Los argumentos serán serializados con el Structured CloneAlgorithm, al igual que postMessage, así que las cadenas del prototipo no estarán incluidas. El envío de funciones, promesas, símbolos, WeakMaps o WeakSets lanzará una excepción.

NOTA: Enviar tipos de JavaScript no estándar tales como objetos DOM o objetos especiales de Electron lanzará una excepción.

El proceso de renderizado puede manejar el mensaje escuchando el canal con el módulo ipcRenderer.

Un ejemplo de envío de mensajes desde el proceso principal al proceso de renderizado:

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

app.whenReady().then(() => {
  win = new BrowserWindow({ width: 800, height: 600 })
  win.loadURL(`file://${__dirname}/index.html`)
  win.webContents.on('did-finish-load', () => {
    win.webContents.send('ping', 'whoooooooh!')
  })
})

<!-- index.html -->
<html>
<body>
  <script>
    require('electron').ipcRenderer.on('ping', (event, message) => {
      console.log(message) // Prints 'whoooooooh!'
    })
  </script>
</body>
</html>

`contents.sendToFrame(frameId, channel, ...args)`

frameId Integer | [number, number] - the ID of the frame to send to, or a pair of [processId, frameId] if the frame is in a different process to the main frame.
channel cadena
...args any[]

Envía un mensaje asíncrono al frame especifico en un renderer process a través de channel, junto con los argumentos. Los argumentos serán serializados con el Structured CloneAlgorithm, al igual que postMessage, así que las cadenas del prototipo no estarán incluidas. El envío de funciones, promesas, símbolos, WeakMaps o WeakSets lanzará una excepción.

NOTA: Enviar tipos de JavaScript no estándar tales como objetos DOM o objetos especiales de Electron lanzará una excepción.

El proceso de renderizado puede manejar el mensaje escuchando el canal con el módulo ipcRenderer.

Si quieres obtener el frameId de un renderer context dado deberías usar el valor webFrame.routingId. P.e.

// In a renderer process
console.log('My frameId is:', require('electron').webFrame.routingId)

También puede leer el frameId de todos los mensajes IPC entrantes en el proceso principal.

// In the main process
ipcMain.on('ping', (event) => {
  console.info('Message came from frameId:', event.frameId)
})

`contents.postMessage(channel, message, [transfer])`

channel cadena
mensaje cualquiera
transfer MessagePortMain[] (optional)

Envía un mensaje al renderer process, transfiriendo opcionalmente la propiedad de cero o más objetos [MessagePortMain][].

Los objetos MessagePortMain transferidos estarán disponible en el renderer process accediendo a la propiedad ports del evento emitido. Cuando llegan al renderer, serán objetos DOM MessagePort nativos.

Por ejemplo:

// Main process
const { port1, port2 } = new MessageChannelMain()
webContents.postMessage('port', { message: 'hello' }, [port1])

// Renderer process
ipcRenderer.on('port', (e, msg) => {
  const [port] = e.ports
  // ...
})

`contents.enableDeviceEmulation(parameters)`

Objeto parameters
- screenPosition string - Specify the screen type to emulate (default: desktop):
  - desktop - El tipo de la pantalla de escritorio.
  - mobile - El tipo de la pantalla móvil.
- screenSize Size - Configura el tamaño de la pantalla emulada (screenPosition == mobile).
- viewPosition Point - Posiciona la vista sobre la pantalla (screenPosition == mobile) (por defecto: { x: 0, y: 0 }).
- deviceScaleFactor Integer - Configura el factor escala del dispositivo (si es cero regresa por defecto al factor de escala original del dispositivo) (por defecto: 0).
- viewSize Size - Configura el tamaño de la vista emulada (en blanco significa que no hay anulación)
- scale Float - Escala de la vista emulada dentro del espacio disponible (no dentro del modo vista) (por defecto: 1).

Habilita la emulación del dispositivo con los parámetros predeterminados.

`contents.disableDeviceEmulation()`

Deshabilita la emulación del dispositivo habilitado por webContents.enableDeviceEmulation.

`contents.sendInputEvent(inputEvent)`

inputEvent MouseInputEvent | MouseWheelInputEvent | KeyboardInputEvent

Envía un input event a la página. Nota: El BrowserWindow que contiene los contenidos necesita estar enfocado para que sendInputEvent() trabaje.

`contents.beginFrameSubscription([onlyDirty ,]callback)`

onlyDirty boolean (opcional) - Por defecto es false.
callback Función
- image NativeImage
- dirtyRect Rectangle

Empezar suscripción para eventos de presentación y capturas de fotogramas, la callback sera llamada con callback(image, dirtyRect) cuando hay un evento de presentación.

La image es una instancia de NativeImage que almacena el fotograma capturado.

El dirtyRect es un objeto con propiedades x, y, width, height que describe cual parte de la página fue pintada de nuevo. Si onlyDirty está configurado a true, image solo contendrá el área repintada. onlyDirty por defecto en false.

`contents.endFrameSubscription()`

Finalizar suscripción para eventos de presentación de marcos.

`contents.startDrag(item)`

Objeto item
- file string - La ruta al archivo que está siendo arrastrado.
- files string[] (opcional) - Las rutas a los archivos que están siendo arrastrados. (files anulará el campo file)
- icon NativeImage | string - The image must be non-empty on macOS.

Configura el item como un elemento arrastrable para la operación drag-drop actual. El file es la ruta absoluta del archivo que se va a arrastrar, y icon es la imagen que se muestra debajo del cursor cuando se arrastra.

`contents.savePage(fullPath, saveType)`

fullPath string - The absolute file path.
saveType string - Specify the save type.
- HTMLOnly - Guarda solamente el HTML de la página.
- HTMLComplete - Guarda una página html completa.
- MHTML - Guarda una página html completa como MHTML.

Devuelve Promise<void> - resuelve si la pagina se guardo.

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

win.loadURL('https://github.com')

win.webContents.on('did-finish-load', async () => {
  win.webContents.savePage('/tmp/test.html', 'HTMLComplete').then(() => {
    console.log('Page was saved successfully.')
  }).catch(err => {
    console.log(err)
  })
})

`contents.showDefinitionForSelection()` macOS

Muestra un diccionario que busca la palabra seleccionada en la página.

`contents.isOffscreen()`

Devuelve boolean - Indica si offscreen rendering está habilitado o no.

`contents.startPainting()`

Si offscreen rendering está habilitado y no pinta, comienza a pintar.

`contents.stopPainting()`

Si offscreen rendering está habilitado y pinta, deja de pintar.

`contents.isPainting()`

Devuelve boolean - Si offscreen rendering está habilitado devuelve lo que esté pintando en ese momento.

`contents.setFrameRate(fps)`

fps Integer

Si offscreen rendering está activada establece el radio del frame al número especificado. Sólo se aceptan valores entre 1 y 240.

`contents.getFrameRate()`

Devuelve Integer - Si offscreen rendering esta habilitado devuelve el indice de fotogramas en ese momento.

`contents.invalidate()`

Programa un repintado completo de la ventana en la que se encuentra este contenido web.

Si offscreen rendering está habilitado invalida el fotograma y genera uno nuevo a través del evento 'paint'.

`contents.getWebRTCIPHandlingPolicy()`

Devuelve string - Devuelve el WebRTC IP Handling Policy.

`contents.setWebRTCIPHandlingPolicy(policy)`

policy string - Specify the WebRTC IP Handling Policy.
- default - Revela los IPs locales y publicos del usuario. Este es el comportamiento por defecto. Cuando se usa esta política, WebRTC tiene el derecho de enumerar todas las interfaces y vincularlas para descubrir interfaces públicas.
- default_public_interface_only - Revela el IP público del usuario pero no revela el IP local del usuario. Cuando se usa esta política, WebRTC solo debe usar la ruta predeterminada utilizada por http. Esto no expone ninguna dirección local.
- default_public_and_private_interfaces - Revela los IPs público y local del usuario. Cuando se usa esta política, WebRTC solo debe usar la ruta predeterminada utilizada por http. Esto también expone la dirección privada predeterminada asociada. La ruta predeterminada es la ruta elegida por el SO en un punto final multitarjeta.
- disable_non_proxied_udp - Does not expose public or local IPs. When this policy is used, WebRTC should only use TCP to contact peers or servers unless the proxy server supports UDP.

La configuración de política de manejo WebRTC IP, le permite controlar cuales IPs son expuestas a través de WebRTC. Vea BrowserLeaks para más detalles.

`contents.getMediaSourceId(requestWebContents)`

requestWebContents WebContents - Web contents that the id will be registered to.

Returns string - The identifier of a WebContents stream. This identifier can be used with navigator.mediaDevices.getUserMedia using a chromeMediaSource of tab. The identifier is restricted to the web contents that it is registered to and is only valid for 10 seconds.

`contents.getOSProcessId()`

Devuelve Integer - El pid del sistema operativo, del proceso de renderizado asociado.

`contents.getProcessId()`

Devuelve Integer - El pid interno de Chromium del renderizador asociado. Puede ser comparado con el frameProcessId pasado por los eventos de navegación específicos del frame (e.g. did-frame-navigate)

`contents.takeHeapSnapshot(filePath)`

filePath string - Ruta al archivo de salida.

Devuelve Promise<void> - Indica si la instantánea se ha creado correctamente.

Toma una instantánea de la pila V8 y la guarda en filePath.

`contents.getBackgroundThrottling()`

Devuelve boolean - si este contenido web acelerará o no animaciones y temporizadores cuando la página se haga de fondo. Esto también afecta a la API de visibilidad de página.

`contents.setBackgroundThrottling(allowed)`

allowed boolean

Controla si este WebContents acelerará o no las animaciones y los temporizadores cuando la página pasa a segundo plano. Esto también afecta a la API de visibilidad de página.

`contents.getType()`

Devuelve string - el tipo de webContent. Puede ser backgroundPage, window, browserView, remote, webview o offscreen.

`contents.setImageAnimationPolicy(policy)`

policy string - Puede ser animate, animateOnce o noAnimation.

Establece la política de animación de imágenes para este webContents. La política solo afecta a imágenes new, las imágenes que se está animando actualmente no son afectadas. Esta es una limitación conocida en Chromium, puede forzar que la animación de la imagen sea recalculada con img.src = img.src lo cual no dará como resultado tráfico de red pero actualizará la política de la animación.

Esto corresponde a la característica de accesibilidad animationPolicy en Chromium.

Propiedades de la instancia

`contents.audioMuted`

Una propiedad boolean que determina si la página está silenciada.

`contents.userAgent`

Una propiedad string que determina el user agent para esta página web.

`contents.zoomLevel`

Una propiedad number que determina el nivel de zoom de este contenido web.

El tamaño original es 0 y cada incremento por encima o por debajo representa un zoom del 20% mayor o menor a los límites predeterminados de 300% y 50% del tamaño original, respectivamente. La formula para esto es scale := 1.2 ^ level.

`contents.zoomFactor`

Una propiedad number que determina el facto del zoom para este contenido web.

El factor de zoom es el porcentaje de zoom dividido entre 100, por lo que 300% = 3.0.

`contents.frameRate`

Una propiedad Integer que establece el ratio del frame del contenido web al número especificado. Sólo se aceptan valores entre 1 y 240.

Solo aplicable si offscreen rendering está habilitado.

`contents.id` SoloLectura

Un Integer representando el ID único de este WebContents. Cada ID es único entre todas las instancias WebContents de toda la aplicación Electron.

`contents.session` SoloLectura

Un Session usado por este webContents.

`contents.hostWebContents` SoloLectura

Un instancia de WebContents que podría poseer este WebContents.

`contents.devToolsWebContents` SoloLectura

Una propiedad WebContents | null que representa el WebContents de la DevTools asociada con el WebContents dado.

Note: Los usuario nunca deberían almacenar este objeto porque puede convertirse en null cuando el DevTools ha sido cerrado.

`contents.debugger` SoloLectura

Una instancia Debugger para este webContents.

`contents.backgroundThrottling`

Una propiedad boolean que determina si este WebContents acelera o no las animaciones y los temporizadores cuando la página pasa a segundo plano. Esto también afecta a la API de visibilidad de página.

`contents.mainFrame` SoloLectura

A WebFrameMain property that represents the top frame of the page's frame hierarchy.

Métodos
Clase: WebContents

webContents

Métodos​

webContents.getAllWebContents()​

webContents.getFocusedWebContents()​

webContents.fromId(id)​

webContents.fromDevToolsTargetId(targetId)​

Clase: WebContents​

Eventos de Instancia​

Evento: 'did-finish-load'​

Evento: 'did-fail-load'​

Evento: 'did-fail-provisional-load'​

Evento: 'did-frame-finish-load'​

Evento: 'did-start-loading'​

Evento: 'did-stop-loading'​

Evento: 'dom-ready'​

Evento: 'page-title-updated'​

Evento: 'page-favicon-updated'​

Evento: 'new-window' Deprecated​

Evento: 'did-create-window'​

Evento: 'will-navigate'​

Evento: 'did-start-navigation'​

Evento: 'will-redirect'​

Evento: 'did-redirect-navigation'​

Evento: 'did-navigate'​

Evento: 'did-frame-navigate'​

Evento: 'did-navigate-in-page'​

Evento: 'will-prevent-unload'​

Evento: 'crashed' Obsoleto​

Evento: 'render-process-gone'​

Evento: "unresponsive"​

Evento: "responsive"​

Evento: 'plugin-crashed'​

Evento: 'destroyed'​

Evento: 'before-input-event'​

Evento: "enter-html-full-screen"​

Evento: "leave-html-full-screen"​

Evento: 'zoom-changed'​

Evento: "blur"​

Evento: "focus"​

Evento: 'devtools-opened'​

Evento: 'devtools-closed'​

Evento: 'devtools-focused'​

Evento: 'certificate-error'​

Evento: 'select-client-certificate'​

Evento:'login'​

Evento: 'found-in-page'​

Evento: 'media-started-playing'​

Evento: 'media-paused'​

Evento: 'did-change-theme-color'​

Evento: 'update-target-url'​

Evento: 'cursor-changed'​

Evento: 'context-menu'​

Evento: 'select-bluetooth-device'​

Evento: 'paint'​

Evento: 'devtools-reload-page'​

Evento: 'will-attach-webview'​

Event: 'did-attach-webview'​

Evento: 'console-message'​

Evento: 'error-preload'​

Evento: 'ipc-message'​

Evento: 'ipc-message-sync'​

Evento: 'preferred-size-changed'​

Evento: 'frame-created'​

Métodos de Instancia​

contents.loadURL(url[, options])​

contents.loadFile(filePath[, options])​

contents.downloadURL(url)​

contents.getURL()​

contents.getTitle()​

contents.isDestroyed()​

contents.focus()​

contents.isFocused()​

contents.isLoading()​

contents.isLoadingMainFrame()​

contents.isWaitingForResponse()​

contents.stop()​

contents.reload()​

contents.reloadIgnoringCache()​

contents.canGoBack()​

contents.canGoForward()​

Métodos

`webContents.getAllWebContents()`

`webContents.getFocusedWebContents()`

`webContents.fromId(id)`

`webContents.fromDevToolsTargetId(targetId)`

Clase: WebContents

Eventos de Instancia

Evento: 'did-finish-load'

Evento: 'did-fail-load'

Evento: 'did-fail-provisional-load'

Evento: 'did-frame-finish-load'

Evento: 'did-start-loading'

Evento: 'did-stop-loading'

Evento: 'dom-ready'

Evento: 'page-title-updated'

Evento: 'page-favicon-updated'

Evento: 'new-window' Deprecated

Evento: 'did-create-window'

Evento: 'will-navigate'

Evento: 'did-start-navigation'

Evento: 'will-redirect'

Evento: 'did-redirect-navigation'

Evento: 'did-navigate'

Evento: 'did-frame-navigate'

Evento: 'did-navigate-in-page'

Evento: 'will-prevent-unload'

Evento: 'crashed' Obsoleto

Evento: 'render-process-gone'

Evento: "unresponsive"

Evento: "responsive"

Evento: 'plugin-crashed'

Evento: 'destroyed'

Evento: 'before-input-event'

Evento: "enter-html-full-screen"

Evento: "leave-html-full-screen"

Evento: 'zoom-changed'

Evento: "blur"

Evento: "focus"

Evento: 'devtools-opened'

Evento: 'devtools-closed'

Evento: 'devtools-focused'

Evento: 'certificate-error'

Evento: 'select-client-certificate'

Evento:'login'

Evento: 'found-in-page'

Evento: 'media-started-playing'

Evento: 'media-paused'

Evento: 'did-change-theme-color'

Evento: 'update-target-url'

Evento: 'cursor-changed'

Evento: 'context-menu'

Evento: 'select-bluetooth-device'

Evento: 'paint'

Evento: 'devtools-reload-page'

Evento: 'will-attach-webview'

Event: 'did-attach-webview'

Evento: 'console-message'

Evento: 'error-preload'

Evento: 'ipc-message'

Evento: 'ipc-message-sync'

Evento: 'preferred-size-changed'

Evento: 'frame-created'

Métodos de Instancia

`contents.loadURL(url[, options])`

`contents.loadFile(filePath[, options])`

`contents.downloadURL(url)`

`contents.getURL()`

`contents.getTitle()`

`contents.isDestroyed()`

`contents.focus()`

`contents.isFocused()`

`contents.isLoading()`

`contents.isLoadingMainFrame()`

`contents.isWaitingForResponse()`

`contents.stop()`

`contents.reload()`

`contents.reloadIgnoringCache()`

`contents.canGoBack()`

`contents.canGoForward()`

`contents.canGoToOffset(offset)`