Saltar al contenido

Empezar

GitHub

Puede utilizar nuestra configuración asistida por inteligencia artificial para instalar el plugin. Agregue las Capgo habilidades a su herramienta de inteligencia artificial utilizando el siguiente comando:

Puerta de enlace de terminal
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Luego utilice el siguiente prompt:

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

Si prefiere la configuración manual, instale el plugin ejecutando los siguientes comandos y siguiendo las instrucciones específicas de la plataforma a continuación:

  1. Instalar el paquete

    Puerta de enlace de terminal
    bun add @capgo/capacitor-webview-version-checker
  2. Sincronizar proyectos nativos

    Ventana de terminal
    bunx cap sync
  3. Opcional: agregar configuración de plugin Puedes ejecutar con valores por defecto (WebviewVersionChecker: {}) o personalizar el comportamiento de la solicitud y el umbral en capacitor.config.ts.

Por defecto, este plugin utiliza una regla de compatibilidad estilo Browserslist:

  • minimumDeviceSharePercent se aplica por defecto 3
  • el conjunto de datos compartido se compila en tiempo de compilación desde los datos de caniuse
  • no se necesita una llamada de URL de conjunto de datos de tiempo de ejecución para el flujo por defecto
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
plugins: {
WebviewVersionChecker: {},
},
};
export default config;

Configuración simple (solo configuración) (muestra prompt nativo)

Sección titulada “Configuración simple (solo configuración) (muestra prompt nativo)”
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
plugins: {
WebviewVersionChecker: {
autoPromptOnOutdated: true,
},
},
};
export default config;

Modo de umbral avanzado (conjunto de datos personalizado)

Sección titulada “Modo de umbral avanzado (conjunto de datos personalizado)”
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
plugins: {
WebviewVersionChecker: {
minimumDeviceSharePercent: 3,
versionShareByMajor: {
'137': 58.2,
'136': 21.3,
'135': 4.6,
'134': 2.1,
},
autoPromptOnOutdated: true,
},
},
};
export default config;

Utiliza esto solo si deseas compatibilidad basada en la participación real del mundo en lugar de solo una versión fija.

  • minimumDeviceSharePercent: 3 significa que la versión mayor instalada debe representar al menos el 3% en tu conjunto de datos.
  • versionShareByMajor es tu mapa personalizado: versión mayor => porcentaje.
  • Si prefieres datos remotos, utiliza versionShareApiUrl con uno de:
    • { "versionShareByMajor": { "137": 54.2, "136": 23.8 } }
    • { "shareByMajor": { "137": 54.2, "136": 23.8 } }
    • { "versions": [{ "major": 137, "share": 54.2 }, { "version": "136.0.0.0", "percent": 23.8 }] }
import { WebviewVersionChecker } from '@capgo/capacitor-webview-version-checker';
await WebviewVersionChecker.addListener('webViewOutdated', (status) => {
console.log('Outdated WebView detected', status);
});
await WebviewVersionChecker.check({
minimumMajorVersion: 124,
showPromptOnOutdated: true,
});

¿Por qué utilizar este plugin en lugar de solo la configuración Capacitor

Sección titulada “¿Por qué utilizar este plugin en lugar de solo la configuración Capacitor”

Capacitor admite verificaciones de mínimo estático:

android: {
minWebViewVersion: 124,
},
server: {
errorPath: 'unsupported-webview.html',
}

Este plugin agrega eventos de tiempo de ejecución y UX de solicitud nativa, por lo que los usuarios aún pueden abrir y usar la aplicación mientras se les anima a actualizar.

Orden de evaluación:

  1. Modo de umbral de compartición de dispositivo (minimumDeviceSharePercent + conjunto de datos), si se proporciona
  2. Modo de versión más reciente (latestVersion / latestVersionApiUrl)
  3. Modo de fallback de mayor versión mínima (minimumMajorVersion)

El plugin admite ambos modelos de proveedores de WebView utilizados por Capacitor en Android:

  • Android 5-6 y 10+: Android System WebView (com.google.android.webview)
  • Android 7-9: Google Chrome (com.android.chrome)

Si estás utilizando Getting Started para planificar el comportamiento de medios y interfaz nativa, conecta con Usando @capgo/capacitor-webview-version-checker para la capacidad nativa en Usando @capgo/capacitor-webview-version-checker, Usando @capgo/capacitor-actividades-en-vivo para la capacidad nativa en Usando @capgo/capacitor-actividades-en-vivo, @capgo/capacitor-actividades-en-vivo para el detalle de implementación en @capgo/capacitor-actividades-en-vivo, Usando @capgo/capacitor-reproductor-de-videos para la capacidad nativa en Usando @capgo/capacitor-reproductor-de-videos, y @capgo/capacitor-reproductor-de-videos para el detalle de implementación en @capgo/capacitor-reproductor-de-videos.