Compartir a través de

Administración personalizada de solicitudes de red

  • Artículo

El control WebView2 de Microsoft Edge le permite interactuar con las solicitudes de red y modificarlas. Puede proporcionar una respuesta o modificar la solicitud de red mediante los WebResourceRequested eventos y WebResourceResponseReceived . También hay una funcionalidad especial que le permite navegar con solicitudes de red específicas mediante NavigateWithWebResourceRequest API.

En este artículo se describe cómo puede modificar las solicitudes de red. Use esta API y enfoque para:

  • Cargue contenido de archivo local en la aplicación para agregar compatibilidad con la funcionalidad sin conexión.
  • Bloquear contenido en una página web, como imágenes específicas.
  • Ajuste la autenticación para páginas específicas.

Terminología:

Término Definición
Interceptar La aplicación host puede interceptar una solicitud que se envía desde el control WebView2 al servidor HTTP, leer o modificar la solicitud y, a continuación, enviar la solicitud sin cambios o modificada al servidor HTTP (o al código local en lugar del servidor HTTP).
Anular La aplicación host puede invalidar una respuesta que se envía desde el servidor HTTP al control WebView2 y enviar una respuesta personalizada al control WebView2 en lugar de a la respuesta original.

Cuándo usar enfoques personalizados frente a básicos

El WebResourceRequested evento es una API de bajo nivel que proporciona más control, pero requiere más codificación y es complicado de usar. Para algunos escenarios comunes, proporcionamos API que son más fáciles de usar y están optimizadas para esos escenarios específicos, y se recomienda usar esas API en lugar de las API que se describen en este artículo.

En lugar de usar las API WebResourceRequested, es preferible usar estos otros enfoques cuando sea factible:

Nota: En el caso de las direcciones URL con nombres de host virtuales, no se admite el uso del WebResourceRequested evento. Esto se debe a que el WebResourceRequested evento no se desencadena para el método SetVirtualHostNameToFolderMapping.

Cómo interactúan la aplicación host, el control WebView2 y el servidor HTTP

El control WebView2 se encuentra entre la aplicación host y el servidor HTTP. Cuando la aplicación host navega a un URI, el control WebView2 envía una solicitud al servidor HTTP. A continuación, el servidor HTTP envía una respuesta al control WebView2.

Interceptar una solicitud para supervisarla o modificarla

La aplicación host puede interceptar una solicitud que se envía desde el control WebView2 al servidor HTTP, leer o modificar la solicitud y, a continuación, enviar la solicitud sin cambios o modificada al servidor HTTP (o al código local en lugar del servidor HTTP).

Interceptar la solicitud permite personalizar el contenido del encabezado, la dirección URL o el método GET/POST. Es posible que la aplicación host quiera interceptar una solicitud para proporcionar contenido POST opcional como parte de la solicitud.

La aplicación host puede cambiar las propiedades de una solicitud mediante esta API:

Qué puede hacer con los encabezados

Un encabezado HTTP proporciona información importante y metadatos sobre una solicitud o respuesta. El cambio de encabezados permite realizar acciones eficaces en la red.

Se puede usar un encabezado de solicitud para indicar el formato de la respuesta (por ejemplo, los Accept-* encabezados), establecer tokens de autenticación, leer y escribir cookies (información confidencial), modificar el agente de usuario, etc. Se puede usar un encabezado de respuesta para proporcionar más contexto de la respuesta.

Filtrado del evento WebResourceRequested en función de la dirección URL y el tipo de recurso

Para recibir WebResourceRequested eventos, especifique filtros para las solicitudes en las que está interesada la aplicación host, en función de la dirección URL y el tipo de recurso.

Por ejemplo, supongamos que la aplicación host está intentando reemplazar imágenes. En este caso, la aplicación host solo está interesada en WebResourceRequested eventos para imágenes. La aplicación host solo obtendría eventos para las imágenes especificando el resourceContext filtro para las imágenes.

Otro ejemplo es si la aplicación host solo está interesada en todas las solicitudes que se encuentran en un sitio como https://example.com. A continuación, la aplicación puede especificar un filtro https://example.com/* de dirección URL para obtener eventos asociados a ese sitio.

Para obtener más información sobre cómo funciona el filtro de dirección URL, vea Comentarios del método > CoreWebView2.AddWebResourceRequestedFilter.

¿Por qué desea interceptar las solicitudes enviadas desde WebView2?

Interceptar las solicitudes enviadas desde WebView2 le permite configurar aún más la solicitud. Es posible que la aplicación host quiera proporcionar contenido opcional como parte de la solicitud que el control WebView2 no sabrá por sí solo. Algunos escenarios incluyen:

  • Está iniciando sesión en una página y la aplicación tiene credenciales para que la aplicación pueda proporcionar el encabezado de autenticación sin que el usuario tenga que escribir esas credenciales.
  • Quiere funcionalidad sin conexión en la aplicación para redirigir la dirección URL a una ruta de acceso de archivo local cuando no se detecta ninguna conexión a Internet.
  • Quiere cargar contenido de archivo local en el servidor de solicitudes a través de una solicitud POST.

Secuencia para modificar solicitudes

Diagrama de secuencia para modificar solicitudes

  1. La aplicación host configura un WebResourceRequested filtro.
  2. La aplicación host define los controladores de eventos para WebResourceRequested y WebResourceResponseReceived.
  3. La aplicación host navega el control WebView2 a una página web.
  4. El control WebView2 crea una solicitud para un recurso necesario para la página web.
  5. El control WebView2 desencadena un WebResourceRequested evento en la aplicación host.
  6. La aplicación host escucha y controla el WebResourceRequested evento.
  7. La aplicación host puede modificar los encabezados en este momento. La aplicación host también puede aplazar el WebResourceRequested evento, lo que significa que la aplicación host pide más tiempo para decidir qué hacer.
  8. La pila de red WebView2 puede agregar más encabezados (por ejemplo, puede agregar cookies y encabezados de autorización).
  9. El control WebView2 envía la solicitud al servidor HTTP.
  10. El servidor HTTP envía la respuesta al control WebView2.
  11. El control WebView2 desencadena el WebResourceResponseReceived evento.
  12. La aplicación host escucha el WebResourceResponseReceived evento y lo controla.

Ejemplo: Interceptación de una solicitud para supervisarla o modificarla

En el ejemplo siguiente, la aplicación host intercepta la solicitud de documento que se envía desde el control WebView2 al http://www.example.com servidor HTTP, agrega un valor de encabezado personalizado y envía la solicitud.

// Add a filter to select all resource types under http://www.example.com
webView.CoreWebView2.AddWebResourceRequestedFilter(
      "http://www.example.com/*", CoreWebView2WebResourceContext.All);
webView.CoreWebView2.WebResourceRequested += delegate (
   object sender, CoreWebView2WebResourceRequestedEventArgs args) {
   CoreWebView2WebResourceContext resourceContext = args.ResourceContext;
   // Only intercept the document resources
   if (resourceContext != CoreWebView2WebResourceContext.Document)
   {
      return;
   }
   CoreWebView2HttpRequestHeaders requestHeaders = args.Request.Headers;
   requestHeaders.SetHeader("Custom", "Value");
};

Invalidar una respuesta para reemplazarla de forma proactiva

De forma predeterminada, el servidor HTTP envía respuestas al control WebView2. La aplicación host puede invalidar una respuesta que se envía desde el servidor HTTP al control WebView2 y enviar una respuesta personalizada al control WebView2 en lugar de a la respuesta original.

Secuencia para invalidar respuestas

Diagrama de secuencia para invalidar respuestas

  1. La aplicación host configura un WebResourceRequested filtro.
  2. La aplicación host define los controladores de eventos para WebResourceRequested y WebResourceResponseReceived.
  3. La aplicación host navega el control WebView2 a una página web.
  4. El control WebView2 crea una solicitud para un recurso necesario para la página web.
  5. El control WebView2 desencadena un WebResourceRequested evento en la aplicación host.
  6. La aplicación host escucha y controla el WebResourceRequested evento.
  7. La aplicación host establece una respuesta al controlador de WebResourceRequested eventos. La aplicación host también puede aplazar el WebResourceRequested evento, lo que significa que la aplicación host pide más tiempo para decidir qué hacer.
  8. El control WebView2 representa la respuesta como recurso.

Ejemplo: Invalidación de una respuesta para reemplazarla de forma proactiva

// Add a filter to select all image resources
webView.CoreWebView2.AddWebResourceRequestedFilter(
      "*", CoreWebView2WebResourceContext.Image);
webView.CoreWebView2.WebResourceRequested += delegate (
   object sender, CoreWebView2WebResourceRequestedEventArgs args) {
    
   // Replace the remote image resource with a local one specified at the path customImagePath.
   // If response is not set, the request will continue as it is.
   FileStream fs = File.Open(customImagePath, FileMode.Open);
   CoreWebView2WebResourceResponse response = webView.CoreWebView2.Environment.CreateWebResourceResponse(fs, 200, "OK", "Content-Type: image/jpeg");
   args.Response = response;
};

Construcción de una solicitud personalizada y navegación con esa solicitud

El NavigateWithWebResourceRequest método permite a la aplicación host navegar por el control WebView2 mediante un WebResourceRequestpersonalizado . Puede usar esta API para crear una solicitud GET o POST que tenga encabezados y contenido personalizados. A continuación, el control WebView2 navegará mediante esta solicitud personalizada.

Ejemplo: Construcción de una solicitud personalizada y navegación con esa solicitud

// This code posts text input=Hello to the POST form page in W3Schools.

// Need to convert post data to UTF-8 as required by the application/x-www-form-urlencoded Content-Type 
UTF8Encoding utfEncoding = new UTF8Encoding();
byte[] postData = utfEncoding.GetBytes("input=Hello");

MemoryStream postDataStream = new MemoryStream(postData.Length);
postDataStream.Write(postData, 0, postData.Length);
postDataStream.Seek(0, SeekOrigin.Begin);

// This acts as a HTML form submit to https://www.w3schools.com/action_page.php
CoreWebView2WebResourceRequest webResourceRequest = 
environment.CreateWebResourceRequest("https://www.w3schools.com/action_page.php",
                                     "POST",
                                     postDataStream,
                                    "Content-Type: application/x-www-form-urlencoded");
webView.CoreWebView2.NavigateWithWebResourceRequest(webResourceRequest);

Supervisión de las solicitudes y respuestas a través del evento WebResourceResponseReceived

Puede supervisar las solicitudes y respuestas a través del WebResourceResponseReceived evento para leer cualquier valor de encabezado.

Ejemplo: Supervisión de las solicitudes y respuestas a través del evento WebResourceResponseReceived

En este ejemplo se muestra cómo leer el valor del encabezado de autorización mediante la supervisión de las solicitudes y respuestas a través del WebResourceResponseReceived evento.

En el código siguiente se muestra cómo se puede usar el WebResourceResponseReceived evento.

WebView.CoreWebView2.WebResourceResponseReceived += CoreWebView2_WebResourceResponseReceived;

// Note: modifications made to request are set but have no effect on WebView processing it.
private async void WebView_WebResourceResponseReceived(object sender, CoreWebView2WebResourceResponseReceivedEventArgs e)
{
    // Actual headers sent with request
    foreach (var current in e.Request.Headers)
    {
        Console.WriteLine(current);
    }

    // Headers in response received
    foreach (var current in e.Response.Headers)
    {
        Console.WriteLine(current);
    }

    // Status code from response received
    int status = e.Response.StatusCode;
    if (status == 200)
    {
        Console.WriteLine("Request succeeded!");

        // Get response body
        try
        {
            System.IO.Stream content = await e.Response.GetContentAsync();
            // Null will be returned if no content was found for the response.
            if (content != null)
            {
                DoSomethingWithResponseContent(content);
            }
        }
        catch (COMException ex)
        {
            // A COMException will be thrown if the content failed to load.
        }
    }
}

Introducción a la referencia de API

Petición:

Respuesta:

Consulte también