Componentes de la plataforma WebView2

Para agregar WebView2 a la aplicación, usa el SDK de WebView2 en el equipo de desarrollo y distribuye el tiempo de ejecución de WebView2 a los equipos de usuario.

Contenido detallado:

Componentes en la máquina de desarrollo y en las máquinas de usuario

Para agregar WebView2 a la aplicación, usa el SDK de WebView2 en el equipo de desarrollo y distribuye el tiempo de ejecución de WebView2 a los equipos de usuario.

Componentes de WebView2 de nivel superior

Término abreviado Description
Aplicación Cualquier aplicación, para cualquier marco o plataforma, que incluya una instancia del control WebView2. Una aplicación puede tener áreas que usan una instancia de control WebView2 y otras áreas que no usan el control.
SDK SDK de WebView2. Cuando una parte de la aplicación usa WebView2, ese código puede llamar a estas API junto con instancias del control WebView2. El SDK de versión se envía a los usuarios y solo contiene API estables. El SDK de la versión preliminar solo lo usan los desarrolladores y contiene algunas API experimentales.
Control Instancia del control WebView2. En una aplicación, normalmente aparece como un área rectangular que contiene contenido web.
Tiempo de ejecución El tiempo de ejecución de WebView2, que es un motor de explorador. Se instalan en equipos de usuario, así como en equipos de desarrollo y pruebas.
Canal de vista previa Un canal de versión preliminar de Microsoft Edge, ya sea Beta (casi estable), Dev o Canary (la compilación más reciente; diariamente). Solo para equipos de desarrollo y pruebas, no para equipos de usuario.

El control WebView2, SDK y entorno de ejecución

El control WebView2, el SDK de WebView2 y el tiempo de ejecución de WebView2 tienen las siguientes funciones:

Componente Role
WebView2 SDK Proporciona API para que los desarrolladores las usen en el código de una aplicación. Se usa por Dev localmente mientras se codifica la aplicación. Dos versiones: SDK de versión preliminar para pruebas de desarrollo locales y SDK de versión para desarrollar código disponible para los usuarios.
Control WebView2 Insertar el control WebView2 en la aplicación. Hospeda el tiempo de ejecución; Sirve como área visible para mostrar contenido web.
Tiempo de ejecución de WebView2 En la máquina de prueba de Dev y en las máquinas de usuario. O bien, en lugar de usar el tiempo de ejecución, los desarrolladores pueden usar un canal de vista previa de Microsoft Edge para realizar pruebas locales, al usar el SDK de versión preliminar.

Diagrama de componentes WebView2 de alto nivel

En el diagrama siguiente se muestran los componentes WebView2 de alto nivel en la máquina de desarrollo y en las máquinas de usuario:

App en el equipo de desarrollo y en el equipo del usuario

Máquina de desarrollo

En esta sección se explica la columna izquierda del diagrama anterior.

La máquina de desarrollo, para desarrollar una aplicación WebView2, consta de los siguientes componentes:

  • Proyecto de Visual Studio: use una plantilla de proyecto de Visual Studio para crear una aplicación de plataforma estándar y, a continuación, agregue el SDK de WebView2 al proyecto como un paquete NuGet.

    • Diseñador de diseño: diseñe los controles en Visual Studio.

      • Instancias de control WebView2: áreas de contenido web de la aplicación. El código del lado web de la aplicación se ejecuta en este control.

      • Instancias de control nativas: controles y paneles nativos de la aplicación.

    • SDK de WebView2.

      • API WebView2 por plataforma, incluidas CoreWebView2, CoreWebView2Controllery CoreWebView2Environment. Se llama principalmente por código del lado nativo.

      • AddHostObjectToScript - Permite exponer las API de plataforma y las API WebView2 al código JavaScript. Ver Interoperabilidad de código nativo y código web

      • API de JavaScript (paquete WebView2Script): llamada por código del lado web para comunicarse con la aplicación host.

    • API de plataforma: API que no son de WebView2 proporcionadas por la plataforma web; que usa el código del lado web.

  • Tiempo de ejecución de WebView2: componente del explorador Microsoft Edge que contiene las API de WebView2 y ejecuta el código del lado web.

Equipo de usuario

En esta sección se explica la columna derecha del diagrama anterior.

En el equipo del usuario final hay los siguientes componentes que participan en la ejecución de una aplicación WebView2:

  • La aplicación host, que el usuario ha instalado y está usando.

    • Código nativo de WebView2: el código nativo que usa las API de WebView2.

    • Código web: el código del lado web que se ejecuta en una instancia de control WebView2.

    • Instancias de control WebView2: el código del lado web de la aplicación WebView2 se ejecuta en un control WebView2.

    • Código nativo no WebView2.

    • Código web no WebView2.

    • Instancias de control nativas.

  • El tiempo de ejecución de WebView2.

SDK de versión preliminar con entorno de ejecución de versión preliminar o SDK de versión con entorno de ejecución estable

Usa cualquiera de las combinaciones:

  • Un SDK de versión preliminar de WebView2 junto con un canal de versión preliminar de Microsoft Edge (Beta, Dev o Canary), que incluye el tiempo de ejecución de vista previa de WebView2.
  • Un SDK de versión de WebView2 junto con el tiempo de ejecución de WebView2.
Tipo de SDK de WebView2 Plataforma de representador Escenario
SDK de versión preliminar Un entorno de ejecución de vista previa de WebView2, que se incluye en un canal de vista previa de Microsoft Edge (beta, Dev o Canary) Para experimentar y probar la aplicación frente a los próximos cambios en las máquinas de desarrollo.
SDK de versión Un entorno de ejecución estable de WebView2 Para el envío de la aplicación a los usuarios finales.

Control WebView2, tiempo de ejecución y SDK

Este diagrama muestra el siguiente esquema:

SDK de versión preliminar de WebView2:

  • API de .NET/C#, incluidas las experimentales.
  • API de WinRT/C#, incluidas las API experimentales.
  • API de Win32/C++, incluidas las experimentales.
  • Paquete WebView2Script (API de JavaScript).

El SDK de la versión preliminar usa un canal de versión preliminar de Microsoft Edge, que incluye:

  • El tiempo de ejecución de vista previa de WebView2.
  • El paquete WebView2Script (API de JavaScript).

SDK de versión de WebView2:

  • API .NET/C#.
  • WinRT/C#.
  • Win32/C++.
  • Paquete WebView2Script (API de JavaScript).

El SDK de versión usa el tiempo de ejecución WebView2 (entorno de ejecución estable WebView2).

  • El tiempo de ejecución incluye el paquete WebView2Script (API de JavaScript).

Descarga periódicamente el SDK más reciente de NuGet. Los vínculos de NuGet se encuentran en las notas de la versión del SDK de WebView2.

El SDK incluye la API de JavaScript, que está en el WebView2Script paquete.

Vea también:

Usar un SDK de versión preliminar y API experimentales con un canal de versión preliminar de Microsoft Edge

Para desarrollar la versión preliminar de la aplicación mediante API experimentales o para probar la aplicación con los próximos cambios del SDK:

  • En el equipo de desarrollo, en el proyecto de Visual Studio, instale una versión preliminar del paquete NuGet del Microsoft.Web.WebView2 SDK. Escribir código que use las API experimentales (y las API estables).
  • En el equipo de desarrollo, instala y usa un canal de versión preliminar de Microsoft Edge.

Para distribuir la aplicación de versión preliminar en la máquina de prueba:

  • En el equipo de prueba, instala un canal de versión preliminar de Microsoft Edge.

Vea también:

Uso de un SDK de versión y API estables con el entorno de ejecución

Para desarrollar la versión de lanzamiento de la aplicación:

  • En el equipo de desarrollo, en el proyecto de Visual Studio, instale una versión de lanzamiento del paquete NuGet del Microsoft.Web.WebView2 SDK. Escribir código que use solo las API estables .
  • En el equipo de desarrollo, usa el tiempo de ejecución de WebView2 (parte del paquete SDK).

El tiempo de ejecución de WebView2 es como un motor de explorador para su uso como un componente en la aplicación.

Hay varias maneras de distribuir la aplicación y el tiempo de ejecución a los usuarios. Consulta Formas de distribuir, instalar y actualizar el tiempo de ejecución en el equipo del usuario anterior.

Vea también:

Diseñar la arquitectura de una aplicación WebView2

Una aplicación host contiene las siguientes categorías de componentes:

  • Instancias de control nativas.
  • Instancias de control WebView2.

Una aplicación host también contiene las siguientes categorías de código:

  • Código nativo, que llama a las API de la plataforma nativa.
  • Código nativo, que llama a las API de WebView2.
  • Código web (JavaScript), que llama a las API de WebView2Script, las API nativas expuestas y las API de plataforma web.

Diseñar la arquitectura de una aplicación WebView2

Formas de distribuir, instalar y actualizar el tiempo de ejecución en el equipo del usuario

Hay varias maneras de distribuir el tiempo de ejecución de WebView2 con la aplicación:

Métodos para distribuir el tiempo de ejecución de WebView2

Nombre del enfoque de distribución Description Notas
Vínculo al programa previo del tiempo de ejecución Evergreen En el instalador de la aplicación, crea un vínculo al programa previo del tiempo de ejecución Evergreen. Pide al instalador de la aplicación que use este vínculo para descargar e instalar mediante programación el programa previo Evergreen en el equipo del usuario. A continuación, invoca el programa previo para instalar el tiempo de ejecución adecuado para el dispositivo del usuario. Para los usuarios que tienen una conexión en línea. El programa previo Evergreen es un pequeño instalador que instala el tiempo de ejecución correcto para la CPU del usuario, utilizando una conexión a Internet.
Empaquetar el programa previo del tiempo de ejecución Evergreen Descargue el programa previo Evergreen en su máquina de desarrollo. Empaqueta y distribuye el programa previo Evergreen con el instalador de la aplicación. A continuación, el instalador de la aplicación invoca el programa previo para instalar el tiempo de ejecución en el equipo del usuario. Para los usuarios que no tienen una conexión confiable al sitio de CDN del programa previo.
Empaquetar el instalador independiente del tiempo de ejecución Evergreen Descargue el instalador independiente Evergreen en su máquina de desarrollo y empaquételo con su aplicación. Empaqueta el instalador independiente Evergreen con el instalador de la aplicación. A continuación, el instalador de la aplicación invoca el instalador independiente Evergreen para instalar el tiempo de ejecución en el dispositivo del usuario. Para usuarios sin conexión. Instalador de Evergreen Runtime independiente de gran tamaño para usuarios sin conexión, que incluye Evergreen Runtime.
Empaquetar un entorno de ejecución de versión no editable Descargue un entorno de ejecución específico de la CPU y específico de la versión en la máquina de desarrollo. Empaqueta y distribuye la versión no editable del entorno en tiempo de ejecución con el instalador de la aplicación. El instalador de la aplicación instala la versión fija específica del tiempo de ejecución en el equipo del usuario. Caso especial, para cuando necesite una versión específica de las API; evita probar si las API más recientes están disponibles.

Los enfoques anteriores se enumeran en la misma secuencia que en la sección Descargar la sección de tiempo de ejecución WebView2 de la página WebView2 de Microsoft Edge , desde los enfoques ligeros hasta los más pesados. Favorecer los enfoques ligeros; Use un enfoque de peso pesado si lo requiere un escenario especializado.

El instalador de la aplicación significa el instalador o actualizador de la aplicación, que puede ser independiente de la aplicación o una parte de la aplicación.

Vea también:

Comunicación con un servidor HTTP

El control WebView2 actúa como intermediario para la comunicación entre la aplicación host y el servidor HTTP.

Aplicación host, control WebView2 y servidor HTTP

Vea también

developer.microsoft.com:

Recursos para el desarrollo de aplicaciones WebView2: