Objeto WebView

Objeto de la ventana del navegador

WebView es un componente de ventana incrustado en el navegador, actualmente solo es compatible con Windows, macOS (10.10+). Use el kernel de IE / Edge en Windows, use WKWebView en macOS.

Debido a que el programa JavaScript en WebView y fibjs no están en el mismo motor, si necesita comunicarse con el programa anfitrión, debe usar mensajes.

El objeto utilizado por WebView para la comunicación es externo, que admite un método postMessage y dos eventos onmessage y onclose.

Un código de ejemplo de comunicación simple es el siguiente:

1
2
3
4
5
6
7
8
9
// index.js
var gui = require('gui');
var webview = gui.open('fs://index.html');

webview.onmessage = msg => console.log(msg);

webview.onload = evt => webview.postMessage("hello from fibjs");

webview.wait();

El contenido de index.html es el siguiente:

1
2
3
4
5
6
7
8
<script>
    external.onclose = function() {
    }

    external.onmessage = function(msg){
        external.postMessage("send back: " + msg);
    };
</script>

Antes de que se cierre la ventana del usuario, se activará el evento external.onclose y external.onclose puede decidir si cerrar. Si external.onclose devuelve falso, la operación se cancela; de lo contrario, la ventana se cerrará.

El siguiente ejemplo esperará 5 segundos después de que el usuario haga clic para cerrar y luego cerrar la ventana.

1
2
3
4
5
6
7
8
9
10
11
12
<script lang="JavaScript">
    var bClose = false;
    external.onclose = function () {
        if (!bClose) {
            setTimeout(function () {
                bClose = true;
                window.close();
            }, 5000);
            return false;
        }
    }
</script>

En el código anterior, debido a que window.close en sí mismo también activa el evento onclose, se debe agregar una variable de cambio para identificar si el evento debe procesarse.

Herencia

Propiedades estáticas

defaultMaxListeners

Entero, el número máximo global predeterminado de oyentes

1
static Integer WebView.defaultMaxListeners;

Atributos de miembros

type

String, el motor WebView de la ventana actual

1
readonly String WebView.type;

dev

Valor, objeto de acceso de DevTools, consulte la interfaz de llamada: https://chromedevtools.github.io/devtools-protocol/

1readonly Value WebView.dev;

onopen

Función, consulta y enlace de evento de éxito de carga, equivalente a on ("open", func);

1
Function WebView.onopen;

onload

Función, consulta y enlace de evento de éxito de carga, equivalente a on ("load", func);

1
Function WebView.onload;

onaddress

Función, consulta y vinculación del evento de cambio de dirección de página, equivalente a on ("dirección", func);

1
Function WebView.onaddress;

ontitle

Función, consulta y vinculación del evento de cambio de título de la página, equivalente a on ("título", func);

1
Function WebView.ontitle;

onmove

Función, consulta y vinculación de eventos de movimiento de ventana, equivalente a on ("move", func);

1
Function WebView.onmove;

El siguiente ejemplo generará las coordenadas de la esquina superior izquierda de la ventana cuando se mueva la ventana:

1
2
3
4
var gui = require('gui');
var webview = gui.open('fs://index.html');

webview.onmove = evt => console.log(evt.left, evt.top);

onresize

Función, consulta y vincular evento de cambio de tamaño de ventana, equivalente a on ("tamaño", func);

1
Function WebView.onresize;

El siguiente ejemplo mostrará el tamaño de la ventana cuando se cambie el tamaño de la ventana:

1
2
3
4
var gui = require('gui');
var webview = gui.open('fs://index.html');

webview.onresize = evt => console.log(evt.width, evt.height);

onclosed

Función, consulta y vincular evento de cierre de ventana, esta vez se activará después de que se cierre WebView, que es equivalente a on ("cerrado", func);

1
Function WebView.onclosed;

onmessage

Función, consulta y enlace para aceptar el evento postMessage en la vista web, equivalente a on ("mensaje", func);

1
Function WebView.onmessage;

Función miembro

loadUrl

Carga especificada url Página de

1
WebView.loadUrl(String url) async;

Parámetros de llamada:

url: Cadena, especificada url

getUrl

Consultar la página actual url

1
String WebView.getUrl() async;

Devolver resultado:

String, Volver a la página actual url

setHtml

Establecer la página html de webview

1
WebView.setHtml(String html) async;

Parámetros de llamada:

html: Cadena, establecer html

reload

Actualizar la página actual

1
WebView.reload() async;

goBack

vuelve a la pagina anterior

1
WebView.goBack() async;

goForward

Avanzar a la página siguiente

1
WebView.goForward() async;

print

Imprimir el documento de la ventana actual

1
WebView.print(Integer mode = 1) async;

Parámetros de llamada:

mode: Entero, parámetro de impresión, 0: impresión rápida; 1: impresión estándar; 2: vista previa de impresión. El valor predeterminado es 1

printToPDF

Imprima el documento de la ventana actual en un archivo PDF

1
WebView.printToPDF(String file) async;

Parámetros de llamada:

file: Cadena, especifique la ruta del pdf

executeJavaScript

Ejecute un fragmento de código JavaScript en la ventana actual

1
WebView.executeJavaScript(String code) async;

Parámetros de llamada:

code: Cadena, especifique el código JavaScript que se ejecutará

executeDevToolsMethod

Ejecute el comando DevTools en la ventana actual y devuelva el resultado

1
2
Variant WebView.executeDevToolsMethod(String method,
    Object params = {}) async;

Parámetros de llamada:

method: String, especifique el comando DevTools que se ejecutará
params: Objeto, especifique los parámetros del comando

Devolver resultado:

Variant, Devuelve el resultado de la ejecución

close

Cerrar la ventana actual

1
WebView.close() async;

postMessage

Envíe un mensaje a la vista web

1
WebView.postMessage(String msg) async;

Parámetros de llamada:

msg: String, el mensaje que se enviará

postMessage necesita enviar un mensaje después de que se cargue la ventana, los mensajes enviados antes se perderán. Por lo tanto, se recomienda llamar a este método después de que se active el evento de carga.

on

Vincular un controlador de eventos al objeto

1
2
Object WebView.on(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Vincular un controlador de eventos al objeto

1
Object WebView.on(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usará como el nombre del evento y el valor de la propiedad se usará como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

addListener

Vincular un controlador de eventos al objeto

1
2
Object WebView.addListener(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Vincular un controlador de eventos al objeto

1
Object WebView.addListener(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usará como el nombre del evento y el valor de la propiedad se usará como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

prependListener

Vincular un controlador de eventos al inicio del objeto

1
2
Object WebView.prependListener(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Vincular un controlador de eventos al inicio del objeto

1
Object WebView.prependListener(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usará como el nombre del evento y el valor de la propiedad se usará como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

once

Vincular una función de procesamiento de eventos de una sola vez al objeto, la función de procesamiento de una sola vez solo se activará una vez

1
2
Object WebView.once(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Vincular una función de procesamiento de eventos de una sola vez al objeto, la función de procesamiento de una sola vez solo se activará una vez

1
Object WebView.once(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usará como el nombre del evento y el valor de la propiedad se usará como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

prependOnceListener

Vincular un controlador de eventos al inicio del objeto

1
2
Object WebView.prependOnceListener(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Vincular un controlador de eventos al inicio del objeto

1
Object WebView.prependOnceListener(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usará como el nombre del evento y el valor de la propiedad se usará como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

off

Cancelar la función especificada de la cola de procesamiento de objetos

1
2
Object WebView.off(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Cancelar todas las funciones en la cola de procesamiento de objetos

1
Object WebView.off(String ev);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Cancelar la función especificada de la cola de procesamiento de objetos

1
Object WebView.off(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usa como el nombre del evento y el valor de la propiedad se usa como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

removeListener

Cancelar la función especificada de la cola de procesamiento de objetos

1
2
Object WebView.removeListener(String ev,
    Function func);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento
func: Función, especifique la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Cancelar todas las funciones en la cola de procesamiento de objetos

1
Object WebView.removeListener(String ev);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Cancelar la función especificada de la cola de procesamiento de objetos

1
Object WebView.removeListener(Object map);

Parámetros de llamada:

map: Objeto, especifique la relación de mapeo de eventos, el nombre de la propiedad del objeto se usa como el nombre del evento y el valor de la propiedad se usa como la función de procesamiento de eventos

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

removeAllListeners

Cancele todos los oyentes de todos los eventos de la cola de procesamiento de objetos. Si se especifica un evento, elimine todos los oyentes del evento especificado.

1
Object WebView.removeAllListeners(String ev);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

Cancele todos los oyentes de todos los eventos de la cola de procesamiento de objetos. Si se especifica un evento, elimine todos los oyentes del evento especificado.

1
Object WebView.removeAllListeners(Array evs = []);

Parámetros de llamada:

evs: Matriz, especifique el nombre del evento

Devolver resultado:

Object, Devuelve el objeto de evento en sí, que es conveniente para llamadas en cadena

setMaxListeners

El límite predeterminado del número de oyentes, solo por compatibilidad

1WebView.setMaxListeners(Integer n);

Parámetros de llamada:

n: Entero, especifique el número de eventos

getMaxListeners

Obtenga el límite predeterminado de la cantidad de oyentes, solo por compatibilidad

1Integer WebView.getMaxListeners();

Devolver resultado:

Integer, Vuelve al número límite predeterminado

listeners

Matriz de oyentes para el evento especificado del objeto de consulta

1
Array WebView.listeners(String ev);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento

Devolver resultado:

Array, Devuelve una matriz de oyentes para el evento especificado.

listenerCount

El número de oyentes para el evento especificado del objeto de consulta.

1
Integer WebView.listenerCount(String ev);

Parámetros de llamada:

ev: Cadena, especifique el nombre del evento

Devolver resultado:

Integer, Devuelve el número de oyentes para el evento especificado.

eventNames

Consultar el nombre del evento del oyente

1
Array WebView.eventNames();

Devolver resultado:

Array, Devuelve una matriz de nombres de eventos.

emit

Activar un evento de forma activa

1
2
Boolean WebView.emit(String ev,
    ...args);

Parámetros de llamada:

ev: Cadena, nombre del evento
args: ..., parámetros de evento, que se pasarán al controlador de eventos

Devolver resultado:

Boolean, Vuelve al estado de activación del evento, devuelve verdadero si hay un evento de respuesta, de lo contrario devuelve falso

toString

Devuelve la representación en cadena del objeto, generalmente devuelve "[Native Object]", el objeto se puede volver a implementar de acuerdo con sus propias características

1
String WebView.toString();

Devolver resultado:

String, Devuelve la representación de cadena del objeto

toJSON

Devuelve la representación en formato JSON del objeto, generalmente devuelve una colección de atributos legibles definidos por el objeto

1
Value WebView.toJSON(String key = "");

Parámetros de llamada:

key: Cadena, sin usar

Devolver resultado:

Value, Devuelve un valor que contiene JSON serializable

Guía de desarrollo

Módulo básico

Objetos incorporados

Módulo de comunidad

Objeto WebView

Herencia

Propiedades estáticas

defaultMaxListeners

Atributos de miembros

type

dev

onopen

onload

onaddress

ontitle

onmove

onresize

onclosed

onmessage

Función miembro

loadUrl

getUrl

setHtml

reload

goBack

goForward

print

printToPDF

executeJavaScript

executeDevToolsMethod

close

postMessage

on

addListener

prependListener

once

prependOnceListener

off

removeListener

removeAllListeners

setMaxListeners

getMaxListeners

listeners

listenerCount

eventNames

emit

toString

toJSON