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.
설치
설치npm install @capgo/capacitor-webview-crashnpx cap syncImport
Importimport { 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);}자연스러운 자동 재시작
자연스러운 자동 재시작 섹션재시작 옵션을 설정하여 JavaScript 런타임이 충돌하거나 로드되지 않은 경우에도 __CAPGO_KEEP_0__에서 결정이 유지되도록 하세요. capacitor.config.ts so the decision stays in native code even when the JavaScript runtime has crashed or has not loaded yet:
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;사용하여 벽시계 재시작을 위해: restartIntervalMs 사용하여 항상 켜져 있는 앱을 사용하세요. 사용자가 동일한 WebView를 오랜 시간 동안 열어둘 수 있는 경우, 키오스크 화면, 제어실 대시보드, 창고 스캐너, POS 터미널, 차량 표지판, 디지털 시그니처와 같은. restartCron 사용하여 항상 켜져 있는 앱을 사용하세요. 사용자가 동일한 WebView를 오랜 시간 동안 열어둘 수 있는 경우, 키오스크 화면, 제어실 대시보드, 창고 스캐너, POS 터미널, 차량 표지판, 디지털 시그니처와 같은. 0 3 * * * __CAPGO_KEEP_0__ reason: 'periodicRestart'Capacitor WKWebView code
__CAPGO_KEEP_0__ restartCron __CAPGO_KEEP_0__ *__CAPGO_KEEP_0__ restartCron __CAPGO_KEEP_0__ restartIntervalMs __CAPGO_KEEP_0__ 0__CAPGO_KEEP_0__
__CAPGO_KEEP_0__
__CAPGO_KEEP_0____CAPGO_KEEP_0__ restartWebView() 현재 JavaScript 런타임이 네이티브 WebView를 미리 교체하기로 결정했을 때, 예를 들어 메모리 집약적인 워크플로우 후 또는 장시간 비대면 세션에 들어가기 직전에:
await WebViewCrash.restartWebView();__CAPGO_KEEP_0__의 pending marker를 작성하고, 현재 호출을 해제한 후 네이티브 __CAPGO_KEEP_0__에게 새로운 WebView를 생성하도록 요청합니다. Android는 호스트 액티비티를 다시 생성하고, iOS는 __CAPGO_KEEP_1__ bridge view를 다시 빌드하여 새로운 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 __CAPGO_KEEP_0__ 개요
getPendingCrashInfo
클립보드에 복사__CAPGO_KEEP_0__ 개요 null __CAPGO_KEEP_2__
const pending = await WebViewCrash.getPendingCrashInfo();if (pending.value) { console.log(pending.value.platform, pending.value.reason);}clearPendingCrashInfo
클립보드에 복사__CAPGO_KEEP_0__이 완료되면 저장된 마커를 삭제합니다.
await WebViewCrash.clearPendingCrashInfo();simulateCrashRecovery
simulateCrashRecovery실제 WebView가 충돌하지 않고 회복 경로를 연습할 수 있도록 QA 및 로컬 디버깅을 위해 가짜 충돌 마커를 생성합니다.
const simulated = await WebViewCrash.simulateCrashRecovery();console.log(simulated.value);restartWebView
restartWebViewcode에게 새로운 WebView를 생성하도록 native를 요청하고 수동으로 다시 시작한 마커를 저장합니다.
await WebViewCrash.restartWebView();플랫폼 노트
플랫폼 노트- Android는
onRenderProcessGone, 포함하여didCrash그리고 플랫폼이 제공할 때.rendererPriorityAtExitiOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다. - iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.
webViewWebContentProcessDidTerminateiOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다. - Manual and scheduled restarts create a fresh WebView. Android recreates the host activity; iOS rebuilds the Capacitor bridge view.
- iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.
reason: 'periodicRestart'iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.reason: 'manualRestart'. - iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.
iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.
iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.PendingCrashInfoResult
iOS는 앱이 종료될 때 앱의 현재 상태를 포함하여 앱의 메타데이터를 저장합니다.export interface PendingCrashInfoResult { /** * Stored crash or restart metadata, or `null` when no marker is pending. */ value: WebViewCrashInfo | null;}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
웹뷰 충돌 정보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
웹뷰 충돌 플랫폼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. upstream의 공공 API이 변경될 때 다시 동기화 하십시오.
Getting Started에서 계속
Getting Started에서 계속하는 섹션Capacitor를 사용 중이라면 Getting Started 자연/native 미디어 및 인터페이스 동작을 계획하려면 Using @capgo/capacitor-webview-crash Using @capgo/capacitor-webview-crash Using @capgo/capacitor-live-activities Using @capgo/capacitor-live-activities @capgo/capacitor-live-activities @capgo/capacitor-live-활동의 구현 세부 정보를 위해 @capgo/capacitor-비디오 플레이어를 사용하여 @capgo/capacitor-비디오 플레이어의 원시 기능을 위해 Using @capgo/capacitor-비디오 플레이어, @capgo/capacitor-비디오 플레이어 @capgo/capacitor-비디오 플레이어의 구현 세부 정보를 위해