¿Puede el front-end capturar paquetes de teléfonos móviles comprobar el estilo de la página?

Después de tres años, volví a entrar en contacto con el desarrollo de páginas h5 móviles. La última vez fue durante mi pasantía en mi último año. Esta vez se trata de un desarrollo híbrido, que implica la interacción entre páginas h5 y aplicaciones nativas. La página h5 debe abrir el estado de inicio de sesión con la aplicación nativa y llamar a la interfaz de la aplicación nativa, como llamar a la cámara nativa para escanear el código QR. A diferencia del desarrollo de miniprogramas WeChat, cuando se desarrolla localmente, WeChat proporciona herramientas de desarrollo de WeChat que se pueden simular y llamar localmente. Pero necesitamos empaquetar archivos estáticos cada vez y cargarlos en el servidor para depurarlos, lo cual es muy problemático.

¿Puede una aplicación nativa ejecutar código local al cargar h5 en línea? La respuesta es sí. Puede interceptar datos de solicitudes de páginas en línea y luego responder al código local mediante herramientas de captura de paquetes como Whistle. Este artículo presenta principalmente el principio de captura de paquetes y el uso del silbato, una herramienta de captura de paquetes.

1. Principio del acaparamiento de bolsas

1.1 ¿Qué es el acaparamiento de bolsas?

La captura de paquetes es la interceptación, retransmisión, edición y volcado de paquetes de datos enviados y recibidos por la red. A través de la captura de paquetes, puede:

Analizar problemas de red

Análisis de negocios

Análisis del flujo de información de la red

Financiamiento del riesgo de big data de la red Control

Detecta ataques que intentan irrumpir en la red.

Detectar mal uso de los recursos de la red por parte de usuarios internos y externos

Detectar el impacto de las intrusiones en la red

Monitorear el tráfico de banda ancha conectado a Internet

Supervisar el tráfico de red (incluidos usuarios internos, usuarios externos y sistemas)

Supervisar el estado de seguridad de Internet y de los ordenadores de los usuarios.

Penetración y engaño

...

Recordando el conocimiento de las redes informáticas, los datos se transmiten en la red en forma de pequeños marcos. Estas tramas se forman mediante un programa especial llamado controlador de red, luego se envían a la red a través de la tarjeta de red y luego a la máquina de destino a través del cable de red, donde ocurre el proceso inverso en un extremo de la máquina de destino. La Ethernet de la máquina receptora captura estas tramas, le dice al sistema operativo que han llegado y luego las almacena. Durante este proceso de transmisión y recepción, puede utilizar un rastreador para capturar paquetes. Como desarrollador front-end, normalmente captura paquetes HTTP/HTTPS en la capa de aplicación.

1.2 Principio de captura de paquetes HTTP/HTTPS

HTTP/HTTPS es un protocolo de comunicación utilizado por la capa de aplicación. La arquitectura de la capa de aplicación común es la arquitectura cliente-servidor.

¿Cómo se comunican entre sí los programas cliente y los programas servidor que se ejecutan en diferentes sistemas terminales? De hecho, en lo que respecta al sistema operativo, es el proceso más que el programa el que se comunica. El proceso puede considerarse como un programa que se ejecuta en el sistema final.

En una aplicación web, el proceso del navegador del cliente intercambia mensajes con el proceso del servidor.

El proceso del navegador necesita conocer la dirección del host del proceso receptor y el identificador del proceso receptor definido en el host de destino, es decir, el puerto de destino.

La mayoría de las aplicaciones constan de pares de procesos que se comunican, y los dos procesos de cada par se envían mensajes entre sí. El proceso envía y recibe mensajes de la red a través de una interfaz de software llamada socket.

Un proceso se puede comparar con una casa, su enchufe puede ser su puerta y el enchufe es el puerto entre la capa de aplicación y la capa de transporte.

Ahora que conocemos el flujo de comunicación entre los dos procesos, ¿cómo capturamos los paquetes? Para dar un ejemplo de la vida, Xiao Ming estaba enamorado de Xiao Wen, por lo que escribió una carta de amor, pero era un poco tímido y le pidió al buen amigo de Xiao Wen, Xiao Hua, que lo ayudara a entregar la carta de amor. En este momento, Xiaohua puede ser responsable de entregar las cartas de amor entre Xiaowen y Xiaoming. Como intermediaria, podía leer en secreto el contenido de sus cartas de amor.

La idea es configurar un proceso intermediario para capturar paquetes de datos, y cada sesión entre los procesos de destino se comunica con el proceso intermediario antes de reenviarlos.

1.2.1 Principio de captura de paquetes HTTP

En weinre://test

Vuelva a visitar el sitio web juejin.cn en su teléfono móvil y luego abra weinre para consulte el siguiente contenido. El verde indica que la conexión remota se realizó correctamente.