Aller directement au contenu principal
Retour aux plugins
@capgo/capacitor-webview-crash
Tutoriel
@capgo/capacitor-webview-crash

Panne de la vue Web

Redémarrer les vues Web crashées nativement et recycler les vues Web longues en cours d'exécution à intervalles fixes

Guide

Tutoriel sur la panne de WebView

Tester sur appareil

Téléchargez l'application Capgo, puis scannez le code QR code.

Lien QR de prévisualisation du plugin WebView Crash code

Utilisation de @capgo/capacitor-webview-crash

Détectez les crashes de WebView récupérés, redémarrez les WebViews morts nativement et recyclez les WebViews longs en cours sur un intervalle fixe avant que la pression de mémoire ne se transforme en OOM.

Installer

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

Ce que ce plugin expose

  • Redémarrage natif après les crashes de WebView sur iOS et Android.
  • Redémarrage natif de WebView sur un intervalle fixe pour les applications kiosk, POS, de signalisation, de scanner et de tableau de bord qui fonctionnent pendant des jours.
  • restartWebView - Permet aux scripts JavaScript de demander un WebView natif frais sans faire une rechargement de page.
  • WebViewCrashPluginConfig - Types plugins.WebViewCrash options en capacitor.config.ts.
  • getPendingCrashInfo - Renvoie le marqueur de crash ou de redémarrage natif stocké, ou null - Efface le marqueur stocké après que votre application ait restauré son état.
  • clearPendingCrashInfo - Crée un marqueur de crash fictif afin de tester les flux de récupération localement.
  • simulateCrashRecovery - Événement de listener déclenché lorsque le marqueur de crash est toujours en attente dans le runtime récupéré.
  • webViewRestoredAfterCrash - Événement de listener déclenché lorsque tout marqueur de redémarrage natif est toujours en attente.
  • webViewRestoredAfterRestart Exemple d'utilisation

Redémarrage Auto-Natif

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

Configurez le comportement de redémarrage dans

afin qu'il continue de fonctionner lorsque JavaScript n'est pas disponible : capacitor.config.ts Les redémarrages planifiés écrivent

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;

__CAPGO_KEEP_0__ reason: 'periodicRestart'. Utilisez restartIntervalMs pour des intervalles fixes ou restartCron pour un programme de 5 champs de cron dans la zone horaire locale du dispositif, comme 0 3 * * * pour un redémarrage quotidien à 03:00. N'configurez pas les deux programmes à la fois : l'initialisation native lance une erreur de configuration mortelle lorsque restartCron est défini et restartIntervalMs est supérieur à 0. Sauvegardez l'état critique de l'application avant d'utiliser des programmes courts.

Redémarrage natif manuel

Appeler restartWebView() lorsque JavaScript décide que la vue WebView native doit être remplacée de manière proactive, par exemple après un flux de travail lourd en mémoire :

await WebViewCrash.restartWebView();

La méthode écrit reason: 'manualRestart' et demande à la native code de créer une vue WebView fraîche. Android reçoit une nouvelle activité. iOS reçoit une nouvelle vue de pont Capacitor WKWebView est créé à la place de la rechargement de la page actuelle.

Référence complète

Continuez à partir de l'utilisation de @capgo/capacitor-webview-crash

Si vous utilisez L'utilisation de @capgo/capacitor-webview-crash pour planifier le comportement des médias natifs et de l'interface, connectez-l’avec @capgo/capacitor-webview-crash pour les détails d'implémentation dans @capgo/capacitor-webview-crash Démarrage pour les détails d'implémentation dans Getting Started, Utilisation de @capgo/capacitor-activités en direct pour la capacité native dans l'utilisation de @capgo/capacitor-activités en direct, @capgo/capacitor-activités en direct pour les détails d'implémentation dans @capgo/capacitor-activités en direct, et Utilisation de @capgo/capacitor-joueur de vidéo pour la capacité native dans l'utilisation de @capgo/capacitor-joueur de vidéo.