Zum Inhalt springen

Erste Schritt

GitHub

Sie können unsere AI-gestützte Einrichtung verwenden, um den Plugin zu installieren. Fügen Sie die Capgo-Fähigkeiten zu Ihrem AI-Tool hinzu, indem Sie die folgende Befehl ausführen:

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

Dann verwenden Sie den folgenden Prompt:

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 den Plugin, indem Sie die folgenden Befehle ausführen und die Plattform-spezifischen Anweisungen unten befolgen:

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

Fügen Sie Listener so früh wie möglich in Ihrer Anwendungsstart hinzu, damit das wiederhergestellte Runtime-System 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);
}

Setzen Sie die Neustartoptionen in capacitor.config.ts so dass die Entscheidung im native code bleibt, selbst wenn das 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 Sie restartIntervalMs für Apps, die immer eingeschaltet sind und bei denen die Benutzer den gleichen WebView über Tage hinweg offen halten können: Kiosk-Anzeigen, Steuerungszentralen, Lager-Scannern, POS-Terminals, Flotten-Tablets und digitale Anzeigen. Verwenden Sie restartCron für Uhrzeiten wie 0 3 * * * für einen täglichen Neustart um 03:00 Uhr in der lokalen Geräetzonenzeit. Geplante Neustarts schreiben einen vorläufigen Marker mit reason: 'periodicRestart', dann wird Android die Hostaktivität neu erstellen und iOS die Capacitor-Brückeansicht neu erstellen, sodass ein neuer WKWebView erzeugt wird, der aus nativen code-Komponenten besteht.

Wählen Sie einen Zeitabstand oder einen Cron-Schedule, den Ihr Produkt ertragen 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, daher müssen Sie vor der Verwendung aggressiver Schedules die angesammelten Ereignisse, ungespeicherte Formulardaten und die aktuelle Navigationseinstellung persistieren.

Aufrufen restartWebView() Kontext: Appflow-Vergleich / -Migration-Werbung. Seite: Ionic-Appflow.astro. Rolle: Website-Text. Gesehen in: Seite ionic-appflow.astro. Bewahrt Capgo-Produkt-/Marken- und Entwicklertrems genau.

await WebViewCrash.restartWebView();

Zwischenablage kopieren reason: 'manualRestart', resolves the current call, then asks native code to create a fresh WebView. Android recreates the host activity. iOS rebuilds the Capacitor bridge view so a new WKWebView löst die aktuelle Anfrage auf, fragt dann den native __CAPGO_KEEP_0__ an, um einen frischen WebView zu erstellen. Android reaktivierte die Hostaktivität. iOS rekonstruiert die __CAPGO_KEEP_1__ Bridgeansicht, sodass stattdessen eine neue

API overview

API-Übersicht

Abschnitt mit dem Titel “getPendingCrashInfo” null wenn nichts im Gange ist.

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

Löscht den gespeicherten Marker nach Abschluss Ihrer Wiederherstellungsverarbeitung.

await WebViewCrash.clearPendingCrashInfo();

Erstellt einen fiktiven Crashmarker, damit QA und lokale Debugging die Wiederherstellungsroute ohne einen echten WebView zu kraschen ausüben können.

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

Speichert einen manuellen Neustartmarker und fragt den native code an, einen frischen WebView zu erstellen.

await WebViewCrash.restartWebView();

Plattformhinweise

Plattformhinweise
  • Android speichert Metadaten zu Crashes von onRenderProcessGone, einschließlich didCrash und rendererPriorityAtExit wenn die Plattform sie bereitstellt.
  • iOS speichert Metadaten zu Crashes von webViewWebContentProcessDidTerminate und fügt den aktuellen Anwendungsstatus hinzu, wenn verfügbar.
  • Manuelle und geplante Neustarts erstellen einen frischen WebView. Android reaktualisiert die Hostaktivität; iOS rekonstruiert die Capacitor Bridgeansicht.
  • Geplante Neustarts verwenden reason: 'periodicRestart'; manuelle Neustarts verwenden reason: 'manualRestart'.
  • Webdetektion von echten Renderer-Crashes funktioniert nicht. Die Webimplementierung simuliert nur das Verhalten mit lokalen Speicher.
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.tsRe-run die Synchronisierung, wenn die öffentliche API upstream geändert wird.

Wenn Sie native Medien und Schnittstellenverhalten planen, verbinden Sie es mit Getting Started mit @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-webview-crash für die native Fähigkeit in Using @capgo/capacitor-webview-crash, Wenn Sie native Medien und Schnittstellenverhalten planen, verbinden Sie es mit @capgo/capacitor-webview-crash Mit @capgo/capacitor-live-aktivitäten für die native Fähigkeit in Mit @capgo/capacitor-live-aktivitäten @capgo/capacitor-live-aktivitäten für die Implementierungsdetail in @capgo/capacitor-live-aktivitäten 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