Zum Inhalt springen

Getting Started

GitHub

Sie können unsere AI-gestützte Einrichtung verwenden, um das Plugin zu installieren. Fügen Sie den Capgo-Fähigkeiten Ihrer AI-Werkzeug mit folgendem Befehl hinzu:

Terminal-Fenster
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Verwenden Sie dann folgende Anfrage:

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

Wenn Sie die manuelle Einrichtung bevorzugen, installieren Sie das Plugin, indem Sie die folgenden Befehle ausführen und folgen Sie den unten angegebenen Plattform-spezifischen Anweisungen:

Terminal-Fenster
npm install @capgo/capacitor-webview-crash
npx cap sync
import { WebViewCrash } from '@capgo/capacitor-webview-crash';

Als frühestmöglich in der App-Startzeit hinzufügen, damit die wiederhergestellte Runtime reagieren kann, bevor die Benutzer weiter navigieren:

import { WebViewCrash } from '@capgo/capacitor-webview-crash';
await WebViewCrash.addListener('webViewRestoredAfterCrash', async (info) => {
console.log('Recovered after a WebView crash', info);
// Rehydrate critical state, reopen the correct screen, or prompt the user to retry.
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);
}

Neustartoptionen in capacitor.config.ts damit die Entscheidung im native code bleibt, selbst wenn die JavaScript-Runtime abgestürzt ist oder noch nicht geladen wurde:

import type { CapacitorConfig } from '@capacitor/cli';
import type { WebViewCrashPluginConfig } from '@capgo/capacitor-webview-crash';
const webViewCrash: WebViewCrashPluginConfig = {
// Enabled by default. Keep this on for long-running apps.
restartOnCrash: true,
// Use a 5-field cron schedule in the device local timezone.
// Do not combine restartCron with an active restartIntervalMs.
restartCron: '0 3 * * *',
// Optional delay before restarting after a crash.
restartAfterCrashDelayMs: 0,
};
const config: CapacitorConfig = {
plugins: {
WebViewCrash: webViewCrash,
},
};
export default config;

Verwenden restartIntervalMs für Apps, die immer eingeschaltet sind, wobei die Benutzer das gleiche WebView für Tage offen halten können: Kiosk-Screens, Steuerungszentralen, Lager-Scannern, POS-Terminals, Flotten-Tablets und digitale Anzeigetafeln. Verwenden Sie restartCron für Uhrzeiten wie 0 3 * * * für einen täglichen Neustart um 03:00 Uhr in der Geräezaehlerzeitzone. Geplante Neustarts schreiben einen vorläufigen Marker mit reason: 'periodicRestart', dann wird Android die Hostaktivität neu erstellt und iOS die Capacitor-Brückeansicht neu erstellt, sodass ein neuer WKWebView erzeugt wird, der aus nativen code erstellt wird.

Wählen Sie ein Intervall oder einen Cron-Schedule, den Ihr Produkt tolerieren kann. restartCron unterstützt *, Listen, Ränge und Schritte. Konfigurieren Sie nicht beide Schedules gleichzeitig: Die native Initialisierung wirft einen fatalen Konfigurationsfehler, wenn restartCron festgelegt ist und restartIntervalMs größer als 0ist. Ein Neustart erstellt ein frisches JavaScript- Runtime, also persistieren Sie die angesammelten Ereignisse, ungelesene Formulardaten und den aktuellen Navigationzustand, bevor Sie aggressive Schedules verwenden.

Aufrufen restartWebView() als der aktuelle JavaScript-Interpreter entscheidet, dass der native WebView vorab ersetzt werden sollte, zum Beispiel nach einem memory-intensiven Workflow oder bevor eine lange unbesetzte Sitzung beginnt:

await WebViewCrash.restartWebView();

Die Methode schreibt einen vorläufigen Marker mit reason: 'manualRestart'erledigt die aktuelle Anfrage, dann fragt sie den native code an, um einen frischen WebView zu erstellen. Android reaktualisiert die Hostaktivität. iOS rekonstruiert die Capacitor Bridgeansicht, sodass ein neuer WKWebView statt der aktuellen Seite neu geladen wird.

Die gespeicherte native Crash- oder Neustartrampe zurückgeben, oder null als nichts vorliegt.

const pending = await WebViewCrash.getPendingCrashInfo();
if (pending.value) {
console.log(pending.value.platform, pending.value.reason);
}

Löscht den gespeicherten Marker nach Abschluss Ihrer Recovery-Handling.

await WebViewCrash.clearPendingCrashInfo();

Erstellt einen fiktiven Crash-Marker, damit QA und lokale Debugging die Recovery-Pfad ohne einen realen WebView ausüben können.

const simulated = await WebViewCrash.simulateCrashRecovery();
console.log(simulated.value);

Speichert einen manuellen Neustart-Marker und fragt den native code an, einen frischen WebView zu erstellen.

await WebViewCrash.restartWebView();
  • Android speichert Crash-Metadaten von onRenderProcessGone, einschließlich didCrash und wenn die Plattform sie bereitstellt. rendererPriorityAtExit iOS speichert Crash-Metadaten von
  • und fügt den aktuellen Anwendungsstatus hinzu, wenn verfügbar. webViewWebContentProcessDidTerminate Manuelle und geplante Neustarts erstellen eine frische WebView. Android reaktualisiert die Hostaktivität; iOS reaktualisiert die __CAPGO_KEEP_0__ Bridgeansicht.
  • Manual and scheduled restarts create a fresh WebView. Android recreates the host activity; iOS rebuilds the Capacitor bridge view.
  • ; manuelle Neustarts verwenden reason: 'periodicRestart'Web detektiert keine echten Renderer-Crashes. Die Web-Implementierung simuliert nur das Verhalten mit lokalen Speicher. reason: 'manualRestart'.
  • Typenverweis
export interface PendingCrashInfoResult {
/**
* Stored crash or restart metadata, or `null` when no marker is pending.
*/
value: WebViewCrashInfo | null;
}
export interface WebViewCrashPluginConfig {
/**
* Restart the WebView from native code when the renderer process dies.
*
* @default true
*/
restartOnCrash?: boolean;
/**
* Fixed native interval, in milliseconds, for proactively replacing long-running WebViews.
*
* Set to `0` to disable interval restarts. Do not combine an active interval
* with `restartCron`; native initialization fails fast when both schedules are configured.
*
* @default 0
*/
restartIntervalMs?: number;
/**
* Cron schedule for proactively replacing long-running WebViews.
*
* Uses standard 5-field cron syntax in the device local timezone:
* `minute hour day-of-month month day-of-week`.
*
* Examples:
* - `0 3 * * *` restarts every day at 03:00.
* - `0,30 * * * *` restarts every 30 minutes.
*
* Do not combine this with an active `restartIntervalMs`; native initialization
* fails fast when both schedules are configured.
*/
restartCron?: string;
/**
* Delay, in milliseconds, before restarting after a crash.
*
* @default 0
*/
restartAfterCrashDelayMs?: number;
}
export interface WebViewCrashInfo {
/**
* Platform that detected and stored the marker.
*/
platform: WebViewCrashPlatform;
/**
* Unix timestamp in milliseconds for when the marker was written.
*/
timestamp: number;
/**
* ISO-8601 version of `timestamp`.
*/
timestampISO: string;
/**
* Platform-specific reason for the crash or restart marker.
*/
reason: WebViewCrashReason;
/**
* Last known WebView URL when the marker was written.
*/
url?: string;
/**
* Android-only hint from `RenderProcessGoneDetail.didCrash()`.
*/
didCrash?: boolean;
/**
* Android-only renderer priority reported at exit.
*/
rendererPriorityAtExit?: number;
/**
* iOS-only application state captured when the WebView process died.
*/
appState?: WebViewCrashAppState;
}
export type WebViewCrashPlatform = 'android' | 'ios' | 'web';
export type WebViewCrashReason =
| 'renderProcessGone'
| 'webContentProcessDidTerminate'
| 'periodicRestart'
| 'manualRestart'
| 'simulated';
export type WebViewCrashAppState = 'active' | 'inactive' | 'background' | 'unknown';

Diese Seite wird aus dem Plugin generiert. src/definitions.tsWiederholen Sie die Synchronisierung, wenn die öffentliche API upstream geändert wird.

Wenn Sie native Medien und Schnittstellenverhalten planen, verbinden Sie es mit Verwenden Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-webview-crash Verwenden Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-webview-crash für die native Fähigkeit in Verwenden Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-webview-crash, Verwenden Sie @capgo/capacitor-live-activities for the native capability in Using @capgo/capacitor-webview-crash, Using @capgo/capacitor-webview-crash für die native Fähigkeit in @capgo/capacitor-live-activities, @capgo/capacitor-live-activities für die Implementierungsdetail in @capgo/capacitor-live-activities, Mit @capgo/capacitor-video-player für die native Fähigkeit in Mit @capgo/capacitor-video-player, und @capgo/capacitor-video-player für die Implementierungsdetail in @capgo/capacitor-video-player.