Introducción a Microsoft Edge WebView2

El control Microsoft Edge WebView2 permite insertar tecnologías web (HTML, CSS y JavaScript) en las aplicaciones nativas. El control WebView2 usa Microsoft Edge como motor de representación para mostrar el contenido web en las aplicaciones nativas.

Contenido detallado:

Introducción

El control Microsoft Edge WebView2 permite insertar tecnologías web (HTML, CSS y JavaScript) en las aplicaciones nativas. El control WebView2 usa Microsoft Edge como motor de representación para mostrar el contenido web en las aplicaciones nativas.

Con WebView2, puede insertar código web en diferentes partes de la aplicación nativa o crear toda la aplicación nativa en una única instancia de WebView2.

Diagrama de una aplicación con áreas de interfaz de usuario nativas en la izquierda y la parte superior izquierda, y áreas de interfaz de usuario de WebView2 en la parte superior derecha e inferior

Enfoque de aplicación híbrida

A menudo los desarrolladores deben decidir entre crear una aplicación web o una aplicación nativa. Esta decisión depende del equilibrio entre alcance y potencia:

  • Las aplicaciones web permiten un amplio alcance. Como desarrollador web, puede reutilizar la mayor parte del código en distintas plataformas.

  • Para acceder a todas las eficaces funcionalidades de una plataforma nativa, use una aplicación nativa.

En el diagrama siguiente se muestra el espectro de aplicaciones, desde el alcance máximo hasta la potencia máxima:

El espectro de aplicaciones, desde el alcance máximo pero menos potencia, hasta una combinación híbrida óptima, hasta la máxima potencia pero menos alcance

  • El alcance amplio incluye sitios web y aplicaciones web progresivas.

  • En el medio, están las aplicaciones híbridas, como WebViews y Electron.

  • La potencia máxima son las aplicaciones nativas.

Las aplicaciones híbridas, en medio de este espectro, le permiten disfrutar de lo mejor de ambos mundos: la ubicuidad y la solidez de la plataforma web, junto con la potencia y las capacidades completas de la plataforma nativa.

Ventajas de WebView2

  • Ecosistema web y conjunto de aptitudes. Use la plataforma web, las bibliotecas, las herramientas y el talento que existe en el ecosistema web.

  • Innovación rápida. El desarrollo web permite una implementación y una iteración más rápidas.

  • Compatibilidad con Windows 10 y 11. Compatibilidad con una experiencia de usuario coherente en Windows 10 y Windows 11.

  • Funcionalidades nativas. Obtenga acceso al conjunto completo de API nativas.

  • Uso compartido de código. Agregar código web a la base de código permite la reutilización en varias plataformas.

  • Soporte técnico de Microsoft. Microsoft proporciona soporte técnico y agrega nuevas solicitudes de características en plataformas compatibles.

  • Distribución de Evergreen. Confíe en una versión actualizada de Chromium con actualizaciones de plataforma y revisiones de seguridad periódicas.

  • Distribución de versión no editable. Opcionalmente, empaquete una versión específica de los bits de Chromium en la aplicación.

  • Adopción incremental. Agregue componentes web paso a paso a la aplicación.

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. 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

Para obtener más información, consulte Componentes de la plataforma WebView2.

Versiones de Windows compatibles

Los sistemas operativos Windows compatibles con Webview2 son los mismos que los compatibles con Microsoft Edge.

Para obtener más información sobre otros sistemas operativos compatibles, consulte Sistemas operativos compatibles con Microsoft Edge.

Cliente de Windows

Las aplicaciones WebView2 se pueden ejecutar en las siguientes versiones de cliente Windows:

  • Windows 10 SAC 1709 y versiones posteriores
  • Windows 10 Enterprise 2015 LTSC
  • Windows 10 Enterprise 2016 LTSC
  • Windows 10 Enterprise 2019 LTSC
  • Windows 10 Enterprise 2021 LTSC
  • Sesión múltiple de Windows 10 Enterprise
  • Windows 10 IoT Enterprise SAC
  • Windows 10 IoT Enterprise 2019 LTSC
  • Windows 10 IoT Enterprise 2021 LTSC
  • Windows 11
  • Sesión múltiple de Windows 11 Empresas
  • Windows 11 IoT Enterprise 2024 LTSC

Para obtener más información, consulte Cliente de Windows en sistemas operativos compatibles con Microsoft Edge.

Windows Server

Las aplicaciones WebView2 se pueden ejecutar en las siguientes versiones de Windows Server:

  • Windows Server 2016 (LTSC)
  • Windows Server 2019 (LTSC)
  • Windows Server 2022 (LTSC)
  • Windows Server (SAC)

Para obtener más información, consulte Windows Server en los sistemas operativos compatibles con Microsoft Edge.

Entornos y dispositivos de programación compatibles

Los siguientes entornos de programación son compatibles con WebView2:

  • Win32 C/C++
  • .NET Framework 4.6.2 o posterior
  • .NET Core 3.1 o posterior
  • .NET 5 o posterior
  • WinUI 2.0
  • WinUI 3.0

Además de en dispositivos Windows, WebView2 también se admite en los siguientes dispositivos:

  • XBOX
  • HoloLens 2

Secuencia de ejemplos que se van a instalar y ejecutar

Para empezar a aprender WebView2, use la siguiente secuencia recomendada:

  1. Instale Visual Studio, instale los canales de versión preliminar de Microsoft Edge y clona el WebView2Samples repositorio. Consulte Configuración del entorno de desarrollo para WebView2.
  2. Instale y ejecute el ejemplo principal. Aplicación de ejemplo de Win32.
  3. Instale y ejecute el ejemplo para la plataforma de destino, si es una plataforma distinta de Win32. Ver aplicaciones de ejemplo de WebView2.
  4. Instale y ejecute el tutorial de Introducción finalizado para la plataforma de destino (si se proporciona el proyecto terminado). Consulte los tutoriales de Introducción.
  5. Siga los pasos de Introducción para agregar código WebView2 al proyecto de inicio de Visual Studio para su plataforma. Consulte los tutoriales de Introducción.

Algunos ejemplos pueden requerir la actualización de un SDK, como se explica en el artículo de cada ejemplo.

Una vez configurado el entorno y compilados y ejecutándose los ejemplos en el equipo, puedes desarrollar la aplicación leyendo el resto de la documentación, como Información general sobre las API de WebView2.

Consulte también

Documentos de empresa de Edge:

developer.microsoft.com:

Microsoft.com:

YouTube:

  • Se actualizó por última vez el