Getting Started
このプラグインのインストール手順とフルマークダウンガイドを含むセットアッププロンプトをコピーします。
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-webview-crash`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/webview-crash/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
インストール
「インストール」のセクションAI-Assisted セットアップを使用してプラグインをインストールできます。AIツールに Capgo スキルを追加するには、以下のコマンドを使用してください。
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins次に、以下のプロンプトを使用してください:
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-webview-crash` plugin in my project.Manual Setupを使用する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム固有の説明を参照してください:
npm install @capgo/capacitor-webview-crashnpx cap syncインポート
「インポート」のセクションimport { WebViewCrash } from '@capgo/capacitor-webview-crash';推奨される復旧フロー
「推奨される復旧フロー」のセクションリスナをアプリケーション起動時からできるだけ早く追加してください。復旧されたランタイムがユーザーが続けてナビゲートする前に反応できるようにしてください:
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);}ネイティブの自動再起動
「ネイティブの自動再起動」セクション再起動オプションを設定する capacitor.config.ts codeのネイティブの決定は、JavaScript ランタイムがクラッシュしたりロードされなかったりする場合でも、codeに残るようにする:
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;常にオンのアプリで、ユーザーが同じWebViewを開いて日々使用する場合に使用します:キオスクスクリーン、コントロールルームダッシュボード、倉庫スキャナ、POS端末、車両タブレット、デジタルサイネージ。 restartIntervalMs 壁時計の再起動の場合、 restartCron デバイスのローカルタイムゾーンの 03:00 の毎日再起動の場合に使用します。 0 3 * * * 予定された再起動は、 reason: 'periodicRestart'、Androidはホストアクティビティを再作成し、iOSはCapacitor ブリッジビューを再構築し、ネイティブCapacitorから新しい WKWebView is created from native code.
選択できる間隔またはcronスケジュールは、製品が耐えられるものを選択してください。 restartCron __CAPGO_KEEP_0__ *リスト、範囲、ステップをサポートしています。両方のスケジュールを一度に設定しないでください: restartCron is set restartIntervalMs is greater than 0native初期化は致命的な構成エラーを投げます。
Aggressiveスケジュールを使用する前に、JavaScriptランタイムの現在の状態、未保存のフォームの状態、現在のナビゲーション状態を保存してください。
手動のnative再起動セクションのタイトル “手動のnative再起動” restartWebView() __CAPGO_KEEP_0__
await WebViewCrash.restartWebView();Copy to clipboard reason: 'manualRestart', native code を呼び出し、最新の WebView を作成します。 Android はホストアクティビティを再作成します。 iOS は Capacitor ブリッジビューを再構築し、最新の WKWebView ページを再読み込みするのではなく、新しい
API の概要
セクションのタイトル “API の概要”getPendingCrashInfo
セクションのタイトル “getPendingCrashInfo”native で保存されたクラッシュまたは再起動マーカーを返します。 または、 null 何も保留中でない場合。
const pending = await WebViewCrash.getPendingCrashInfo();if (pending.value) { console.log(pending.value.platform, pending.value.reason);}clearPendingCrashInfo
セクションのタイトル “clearPendingCrashInfo”あなたの復旧処理が完了したら、保存されたマーカーをクリアします。
await WebViewCrash.clearPendingCrashInfo();simulateCrashRecovery
セクションのタイトル “simulateCrashRecovery”QAとローカルデバッグのために、実際のWebViewをクラッシュさせずに復旧パスを実行できるように、偽のクラッシュマーカーを作成します。
const simulated = await WebViewCrash.simulateCrashRecovery();console.log(simulated.value);restartWebView
「restartWebView」というセクションcodeのnativeに新しいWebViewを作成するように依頼し、手動でマニュアルリスタートマーカーを保存します。
await WebViewCrash.restartWebView();プラットフォームに関する注記
「プラットフォームに関する注記」というセクション- Androidは、
onRenderProcessGone、didCrash、rendererPriorityAtExitを含むクラッシュメタデータを保存します。 - iOSは、
webViewWebContentProcessDidTerminateと利用可能な場合、現在のアプリケーション状態を追加します。 - マニュアルと予定された再起動は、WebViewを新しく作成します。 Androidはホストアクティビティを再作成し、iOSはCapacitor ブリッジビューを再構築します。
- 予定された再起動は
reason: 'periodicRestart'マニュアル再起動はreason: 'manualRestart'. - Webは実際のレンダラークラッシュを検出しません。 Web実装はローカルストレージのみで動作をシミュレートします。
型参照
「型参照」PendingCrashInfoResult
「PendingCrashInfoResult」export interface PendingCrashInfoResult { /** * Stored crash or restart metadata, or `null` when no marker is pending. */ value: WebViewCrashInfo | null;}WebViewCrashPluginConfig
「WebViewCrashPluginConfig」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;}WebViewCrashInfo
「WebViewCrashInfo」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;}WebViewCrashPlatform
「WebViewCrashPlatform」セクションexport type WebViewCrashPlatform = 'android' | 'ios' | 'web';WebViewCrashReason
「WebViewCrashReason」セクションexport type WebViewCrashReason = | 'renderProcessGone' | 'webContentProcessDidTerminate' | 'periodicRestart' | 'manualRestart' | 'simulated';WebViewCrashAppState
「WebViewCrashAppState」セクションexport type WebViewCrashAppState = 'active' | 'inactive' | 'background' | 'unknown';真実の源
「真実の源」セクションこのページはプラグインの src/definitions.ts API がアップストリームで変更されたときに、再度同期を実行してください。
Getting Started から続けてください
「Getting Started」から続けて「Getting Started」を使用している場合 「Getting Started」 ネイティブメディアとインターフェイスの動作を計画するには、 「@capgo/capacitor-webview-crash」を使用して 「@capgo/capacitor-webview-crash」でネイティブ機能を使用する場合 「@capgo/capacitor-live-activities」を使用して 「@capgo/capacitor-live-activities」でネイティブ機能を使用する場合 「@capgo/capacitor-live-activities」 「@capgo/capacitor-live-activities」で実装の詳細を使用する場合 「@capgo/capacitor-video-player」を使用して 「@capgo/capacitor-video-player」でネイティブ機能を使用する場合 @capgo/capacitor-video-player @capgo/capacitor-video-player