Crash WebView Plugin Capacitor

Utiliser @capgo/capacitor-webview-crash

Détectez les crashs WebView récupérés, redémarrez nativement les WebViews plantées et recyclez les WebViews actives à intervalle fixe avant que la pression mémoire ne provoque un OOM.

Installer

npm install @capgo/capacitor-webview-crash
npx cap sync

Ce que ce plugin expose

• Redémarrage natif après un crash WebView sur iOS et Android.
• Fixed-interval native WebView restart for kiosk, POS, signage, scanner, and dashboard apps that run for days.
• restartWebView - Permet au JavaScript de demander une nouvelle WebView native sans recharger la page.
• WebViewCrashPluginConfig - Types plugins.WebViewCrash options dans capacitor.config.ts.
• getPendingCrashInfo - Renvoie le marqueur stocké de crash natif ou de redémarrage, ou null lorsque rien n'est en attente.
• clearPendingCrashInfo - Efface le marqueur stocké une fois que votre application a restauré son état.
• simulateCrashRecovery - Crée un faux marqueur de crash pour tester les flux de récupération localement.
• webViewRestoredAfterCrash - Événement de listener déclenché lorsqu'un marqueur de crash est toujours en attente dans le runtime récupéré.
• webViewRestoredAfterRestart - Événement de listener déclenché lorsqu'un marqueur de redémarrage natif est toujours en attente.

Exemple d'utilisation

import { WebViewCrash } from '@capgo/capacitor-webview-crash';

await WebViewCrash.addListener('webViewRestoredAfterCrash', async (info) => {
  console.log('Recovered after a WebView crash', info);
  await WebViewCrash.clearPendingCrashInfo();
});

await WebViewCrash.addListener('webViewRestoredAfterRestart', async (info) => {
  console.log('Recovered after a native WebView restart', info);
  await WebViewCrash.clearPendingCrashInfo();
});

const pending = await WebViewCrash.getPendingCrashInfo();
// Note: the listener callback may have already cleared the pending marker.
if (pending.value) {
  console.log('Pending crash or restart marker', pending.value);
}

Redémarrage natif automatique

Configurez le comportement de redémarrage dans capacitor.config.ts pour qu'il continue de fonctionner quand le JavaScript est indisponible :

import type { CapacitorConfig } from '@capacitor/cli';
import type { WebViewCrashPluginConfig } from '@capgo/capacitor-webview-crash';

const webViewCrash: WebViewCrashPluginConfig = {
  restartOnCrash: true,
  restartCron: '0 3 * * *',
  restartAfterCrashDelayMs: 0,
};

const config: CapacitorConfig = {
  plugins: {
    WebViewCrash: webViewCrash,
  },
};

export default config;

Les redémarrages planifiés fonctionnent reason: 'periodicRestart'. Utilisez restartIntervalMs à intervalles fixes ou restartCron pour un cron à 5 champs dans le fuseau horaire local de l'appareil, comme par exemple 0 3 * * * pour un redémarrage quotidien à 03:00. Ne configurez pas les deux planifications en même temps : l'initialisation native lève une erreur de configuration fatale quand restartCron est défini et que restartIntervalMs est supérieur à 0. Persistez l'état critique de l'app avant d'utiliser des planifications courtes.

Redémarrage natif manuel

Appelez restartWebView() lorsque le JavaScript décide de remplacer proactivement la WebView native, par exemple après un workflow gourmand en mémoire :

await WebViewCrash.restartWebView();

La méthode écrit reason: 'manualRestart' et demande au code natif de créer une nouvelle WebView. Android recrée l'activité hôte. iOS reconstruit la vue du bridge Capacitor afin qu'une nouvelle WKWebView soit créée au lieu de recharger la page actuelle.

Référence complète

• GitHub : https://github.com/Cap-go/capacitor-webview-crash/
• Docs : /docs/plugins/webview-crash/

Continuer depuis la section Utiliser @capgo/capacitor-webview-crash

Si vous utilisez Utiliser @capgo/capacitor-webview-crash pour planifier le comportement des médias et de l'interface natifs, connectez-l’à @capgo/capacitor-webview-crash pour les détails d'implémentation dans @capgo/capacitor-webview-crash, Prise en main pour les détails d'implémentation dans Getting Started Utiliser @capgo/capacitor-live-activities pour la capacité native dans Utiliser @capgo/capacitor-live-activities @capgo/capacitor-live-activities pour les détails d'implémentation dans @capgo/capacitor-live-activities, et Utiliser @capgo/capacitor-video-player pour la fonctionnalité native dans Utilisation de @capgo/capacitor-video-player.