Saltar al contenido principal
@capgo/capacitor-webview-guardian Auth y seguridad Código abierto

Protección de WebView plugin Capacitor

Detecta si el WebView se cerró en segundo plano y relánzalo al volver al primer plano

Instalar

bun add @capgo/capacitor-webview-guardian bunx cap sync
npm, pnpm o yarn
  • npm install @capgo/capacitor-webview-guardian
  • pnpm add @capgo/capacitor-webview-guardian
  • yarn add @capgo/capacitor-webview-guardian

Guía

Cómo usar WebView Guardian en Capacitor

Probar en el dispositivo

Descarga la app Capgo y escanea el QR code.

QR de vista previa del plugin WebView Guardian code

Usando @capgo/capacitor-webview-guardian

Plugin Capacitor para detectar cuándo se mata el WebView en segundo plano y relanzarlo al volver a primer plano.

Instalar

bun add @capgo/capacitor-webview-guardian
bunx cap sync

bunx cap sync copia el code nativo del plugin en tus proyectos nativos. Ejecútalo de nuevo tras cada actualización del plugin.

Importar

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';

API de un vistazo

Método Descripción
startMonitoring Empieza a observar eventos en primer plano y verifica automáticamente la salud del WebView.
stopMonitoring Detiene el monitoreo automático en primer plano.
getState Devuelve el último estado de monitoreo conocido.
checkNow Fuerza de inmediato una comprobación de salud del WebView.

Ejemplos

startMonitoring()

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);

stopMonitoring()

Detiene el monitoreo automático en primer plano.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';

const result = await WebviewGuardian.stopMonitoring();
console.log(result);

getState()

Devuelve el último estado de monitoreo conocido.

import { WebviewGuardian } from '@capgo/capacitor-webview-guardian';

const result = await WebviewGuardian.getState();
console.log(result);

checkNow()

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);

Escuchar eventos

addListener devuelve un handle. Llama handle.remove() cuando la pantalla se desmonta.

Referencia completa

Continúa desde Uso de @capgo/capacitor-webview-guardian

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

FAQ

FAQ del plugin WebView Guardian

¿Cómo instalo el plugin WebView Guardian en una app Capacitor?

Ejecuta "bun add @capgo/capacitor-webview-guardian" (o "npm install @capgo/capacitor-webview-guardian") y luego "bunx cap sync" para que los proyectos de iOS y Android reconozcan el code nativo. Impórtalo desde "@capgo/capacitor-webview-guardian" en el code de tu app.

¿Es compatible @capgo/capacitor-webview-guardian con React, Vue y Angular?

Sí. WebView Guardian es un paquete Capacitor, por lo que funciona con cualquier framework web que se ejecute dentro de Capacitor, incluyendo Ionic, React, Vue, Angular, Svelte y JavaScript puro.

¿Qué versión de Capacitor es compatible con @capgo/capacitor-webview-guardian?

Los plugins de Capgo siguen la versión mayor de Capacitor: usa la versión mayor del plugin que coincida con la versión mayor de tu Capacitor (por ejemplo, el plugin v8 con Capacitor 8). La tabla de compatibilidad del README de GitHub lista las versiones mantenidas.

¿Es @capgo/capacitor-webview-guardian gratuito y de código abierto?

Sí. El código fuente de code es público en GitHub en https://github.com/Cap-go/capacitor-webview-guardian/ y el paquete se puede instalar gratis desde npm. Los reportes de bugs y pull requests son bienvenidos.

¿Puedo actualizar code que usa WebView Guardian sin pasar por la revisión de la App Store?

Instalar o actualizar el plugin cambia el code nativo, así que requiere un nuevo build para la tienda. Después, los cambios de JavaScript, HTML y CSS que llamen al plugin se pueden publicar al instante con las live updates de Capgo.

Lanza cambios de WebView Guardian sin esperar la revisión de la app

Una vez que el plugin esté en tu store build, Capgo live updates envía tus cambios de JavaScript, HTML y CSS a los usuarios en minutos.

Empieza con Capgo