始めて
このプラグインのインストール手順と全マークダウンガイドを含む設定用の質問をコピーする。
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.
インストール
「インストール」のセクションCapgoのAIアシストセットアップを使用してプラグインをインストールできます。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.If you prefer Manual Setup, install the plugin by running the following commands and follow the platform-specific instructions below:
npm install @capgo/capacitor-webview-crashnpx cap syncImport
「Import」のセクション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 JavaScriptランタイムがクラッシュしたりロードされなかったりする場合でも、native 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 ブリッジビューを再構築し、native Capacitor から新しい WKWebView is created from native code.
間隔またはcronスケジュールを選択して、製品が耐えることができるものを選択します。 restartCron 、リスト、範囲、ステップをサポートします。両方のスケジュールを同時に設定しないでください:native初期化は致命的なconfigエラーを投げます。 *__CAPGO_KEEP_0__ restartCron は設定されています restartIntervalMs は大きくなります 0。再起動は、JavaScriptの新しい実行環境を作ります。したがって、キューされたイベント、未保存のフォームの状態、現在のナビゲーション状態を保存する必要があります。aggressive schedulesを使用する前に。
ネイティブの手動再起動
セクションのタイトル “ネイティブの手動再起動”Call restartWebView() 現在のJavaScriptの実行環境がネイティブのWebViewを予防的に置き換える必要がある場合、たとえばメモリが重いワークフロー後にまたは長時間の無人セッションに入る前に:
await WebViewCrash.restartWebView();このメソッドは、 reason: 'manualRestart'を書き込み、現在のCallを解決し、ネイティブのcodeに新しいWebViewを作成するよう求めます。Androidはホストアクティビティを再作成します。iOSはCapacitorのブリッジビューを再構築し、ページのロードではなく新しいページが作成されます。 WKWebView __CAPGO_KEEP_0__の概要
API overview
「API概要」getPendingCrashInfo
「getPendingCrashInfo」native crash または restart マーカーを取得します。 ただし、nothing が pendding の場合、 null クリップボードにコピー
const pending = await WebViewCrash.getPendingCrashInfo();if (pending.value) { console.log(pending.value.platform, pending.value.reason);}clearPendingCrashInfo
復旧処理が完了したら、ストレージマーカーをクリアします。クリップボードにコピー
await WebViewCrash.clearPendingCrashInfo();simulateCrashRecovery
QAやローカルデバッグのために、実際のWebViewをクラッシュさせずに復旧パスを実行できるように、フェイクのクラッシュマーカーを作成します。クリップボードにコピー
const simulated = await WebViewCrash.simulateCrashRecovery();console.log(simulated.value);restartWebView
simulateCrashRecovery手動再起動マーカーを保存し、ネイティブ code に新しい WebView を作成するよう依頼します。
await WebViewCrash.restartWebView();プラットフォームに関する注意
「プラットフォームに関する注意」セクション- Androidは
onRenderProcessGone、didCrash、rendererPriorityAtExitiOSは - 、
webViewWebContentProcessDidTerminate手動および予定された再起動は、新しい WebView を作成します。Androidはホストアクティビティを再構築します; iOSは__CAPGO_KEEP_0__ ブリッジビューを再構築します。 - Manual and scheduled restarts create a fresh WebView. Android recreates the host activity; iOS rebuilds the Capacitor bridge view.
- スケジュールされた再起動を使用
reason: 'periodicRestart'; __CAPGO_KEEP_0__ の手動再起動を使用reason: 'manualRestart'. - Web が実際のレンダラーのクラッシュを検出しません。Web の実装はローカル ストレージを使用してシミュレートするのみです。
Type reference
「Type reference」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
ウェブビューのクラッシュの理由export type WebViewCrashReason = | 'renderProcessGone' | 'webContentProcessDidTerminate' | 'periodicRestart' | 'manualRestart' | 'simulated';WebViewCrashAppState
ウェブビューのクラッシュのアプリの状態export type WebViewCrashAppState = 'active' | 'inactive' | 'background' | 'unknown';このページはプラグインから生成されます。 src/definitions.ts API の上流で変更された場合に、再度 Sync を実行してください。
Getting Started から続けてください
Section titled “Getting Started から続けてください”Capacitor を使用している場合 Getting Started nativeメディアとインターフェイスの動作を計画し、接続する Using @capgo/capacitor-webview-crash native機能のためのUsing @capgo/capacitor-webview-crash Using @capgo/capacitor-live-activities native機能のためのUsing @capgo/capacitor-live-activities @capgo/capacitor-live-activities native機能の実装詳細の@capgo/capacitor-live-activities Using @capgo/capacitor-video-player native機能のためのUsing @capgo/capacitor-video-player @capgo/capacitor-video-player native機能の実装詳細の@capgo/capacitor-video-player