Capturar HTTP/HTTPS de WKWebView en iOS 18 con Proxyman

1. Problemas

Al trabajar con WKWebView, resulta muy difícil capturar el tráfico de red (HTTP/HTTPS) porque WKWebView no respeta la configuración de proxy del sistema.

WKWebView no ofrece una pestaña de consola de red como Safari.

Por eso, no hay formas sencillas de capturar el tráfico de red de WKWebView.

Este artículo cubre lo siguiente:

• Cómo capturar tráfico HTTPS de WKWebView en iOS 17 o iOS 18 con Proxyman

2. Solución

Desde iOS 17 y iOS 18, WKWebView incorpora proxyConfigurations en WKWebsiteDataStore. Esto nos permite configurar el proxy de WKWebView. Aprovechando esta función, podemos capturar fácilmente el tráfico de red de WKWebView.

Puedes consultar la documentación aquí: https://developer.apple.com/documentation/webkit/wkwebsitedatastore/4264546-proxyconfigurations

Este tutorial muestra cómo capturar el tráfico de red de WKWebView en iOS 17/18 con Proxyman.

2.1. Requisitos previos

1. Descarga Proxyman desde el sitio web de Proxyman

2.2. Configuración

1. Abre tu proyecto en Xcode
2. Busca la instancia actual de WKWebView y añade el siguiente código

lazy var webView: WKWebView = {
    let webConfiguration = WKWebViewConfiguration()

    // ✅ define Proxy Setting to Proxyman
    let httpProxy = ProxyConfiguration(
        httpCONNECTProxy: NWEndpoint.hostPort(
            host: NWEndpoint.Host(
                "127.0.0.1"
            ),
            port: NWEndpoint.Port(
                integerLiteral: 9090
            )
        )
    )

    // ✅ Tell WKWebView to use the Proxy
    let dataSource = WKWebsiteDataStore.default()
    dataSource.proxyConfigurations = [httpProxy]
    webConfiguration.websiteDataStore = dataSource
    
    // init view
    let webView = WKWebView(
        frame: .zero,
        configuration: webConfiguration
    )
    webView.translatesAutoresizingMaskIntoConstraints = false
    return webView
}()

• Asegúrate de reemplazar 127.0.0.1 y 9090 por la IP y el puerto de Proxyman, que son los valores predeterminados.
• Si pruebas en un dispositivo real, necesitas la dirección IP de tu macOS, que aparece en la barra de herramientas de Proxyman, en la parte superior de la ventana.

Simulador de iOS

• Instala el certificado en tu simulador de iOS abriendo Proxyman -> menú Certificate -> Install to iOS -> Simulator -> sigue las instrucciones

iPhone/iPad reales

• Instala el certificado en tu iPhone/iPad abriendo Proxyman -> menú Certificate -> Install to iOS -> Physical Device -> sigue las instrucciones

3. ✅ Vuelve a cargar tu app de iOS y revisa el tráfico en Proxyman

• Todo el tráfico de WKWebView se capturará y mostrará en Proxyman.
• Funciona con HTTP/HTTPS de cualquier biblioteca de terceros, como fetch, axios, XMLHttpRequest, etc.

4. Próximos pasos

• Puedes usar el filtro de Proxyman para aislar el tráfico que quieres depurar.
• También puedes usar la función Replay de Proxyman para reproducir el tráfico que quieres depurar.

Consejo importante sobre la configuración

Mantén esta configuración de proxy solo en una compilación de depuración y no la incluyas en la compilación de App Store. Usa 127.0.0.1 únicamente con un simulador en el mismo Mac; un dispositivo físico necesita la IP del Mac que muestra Proxyman. Aplica el proxy antes de crear el WKWebView. Las conexiones existentes pueden seguir usando la ruta anterior, así que vuelve a crear la web view o su almacén de datos (data store) si cambias el proxy durante una sesión.