Saltar al contenido

Primeros pasos

GitHub

Puedes usar nuestro setup asistido por IA para instalar el plugin. Añade las skills de Capgo a tu herramienta de IA con el siguiente comando:

Ventana de terminal
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Luego usa el siguiente prompt:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-webview-guardian` plugin in my project.

Si prefieres la configuración manual, instala el plugin ejecutando estos comandos y sigue las instrucciones de cada plataforma:

Ventana de terminal
bun add @capgo/capacitor-webview-guardian
bunx cap sync
import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.startMonitoring();
console.log(result);
import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.stopMonitoring();
console.log(result);
import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.getState();
console.log(result);
  • Listeners: elimina los handles cuando se desmonten las pantallas.
  • Sync nativo: ejecuta bunx cap sync tras actualizar los plugins.
  • Fuente de verdad: confianza src/definitions.ts en el repo de GitHub.

Empieza a observar eventos en primer plano y verifica automáticamente la salud del WebView.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.startMonitoring();
console.log(result);

Detiene el monitoreo automático en primer plano.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.stopMonitoring();
console.log(result);

Devuelve el último estado de monitoreo conocido.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.getState();
console.log(result);

Fuerza de inmediato una comprobación de salud del WebView.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';
const result = await WebviewGuardian.checkNow();
console.log(result);
export interface StartMonitoringOptions {
/**
* Delay (in ms) before running a health check after the app re-enters the foreground.
* Defaults to 600ms to let the bridge finish resuming.
*/
foregroundDebounceMs?: number;
/**
* Script executed via `evaluateJavascript`/`evaluateJavaScript` to confirm the WebView is alive.
* Defaults to `document.readyState`.
*/
pingScript?: string;
/**
* Automatically reloads the WebView when a terminated render process is detected.
* Disable to receive `webviewCrashed` events and restart manually.
*/
autoRestart?: boolean;
/**
* Strategy used when restarting the WebView. Defaults to `reload`.
*/
restartStrategy?: RestartStrategy;
/**
* Custom HTTPS/HTTP URL to load when `restartStrategy` is `customUrl`.
*/
customRestartUrl?: string;
/**
* Emits verbose logging in the native layer when true.
*/
debug?: boolean;
/**
* Whether an immediate health check should be executed right after enabling monitoring.
* Defaults to `true`.
*/
runInitialCheck?: boolean;
}
export interface GuardianState {
monitoring: boolean;
reason: string;
timestamp: string;
lastHealthyAt?: string;
lastRestartAt?: string;
lastCrashAt?: string;
pendingRestartReason?: string;
error?: string;
}
export interface CheckNowOptions {
/**
* Text tag describing why a manual check is being requested.
*/
reason?: string;
}
export interface CheckResult {
healthy: boolean;
restarted: boolean;
reason: string;
timestamp: string;
error?: string;
pendingRestart?: boolean;
}
export type GuardianEvent = GuardianState;
export type RestartStrategy = 'reload' | 'reloadFromOrigin' | 'customUrl';

Esta página se genera a partir del plugin src/definitions.ts. Vuelve a ejecutar el sync cuando el API público cambie en upstream.

Si estás usando Primeros pasos para planificar el comportamiento de los medios nativos y la interfaz, conéctalo con Usando @capgo/capacitor-webview-guardian para la capacidad nativa en Usando @capgo/capacitor-webview-guardian, Uso de @capgo/capacitor-live-activities para la capacidad nativa en Uso de @capgo/capacitor-live-activities, @capgo/capacitor-live-activities para los detalles de implementación en @capgo/capacitor-live-activities, Uso de @capgo/capacitor-video-player para la capacidad nativa en Uso de @capgo/capacitor-video-player, y @capgo/capacitor-video-player para el detalle de implementación en @capgo/capacitor-video-player.