Compartir a través de


Acceso a servidores locales

Hospede un sitio en un servidor web de máquina de desarrollo y, a continuación, acceda al contenido desde un dispositivo Android.

El reenvío de puertos permite ver el contenido hospedado por el servidor web que se ejecuta en la máquina de desarrollo en el dispositivo Android.

Si el servidor web usa un dominio personalizado, configure el dispositivo Android para acceder al contenido de ese dominio con la asignación de dominio personalizada.

Con un cable USB y Microsoft Edge DevTools, ejecute un sitio desde una máquina de desarrollo y, a continuación, vea el sitio en un dispositivo Android.

Configuración del reenvío de puertos

El reenvío de puertos permite que el dispositivo Android acceda al contenido que se hospeda en el servidor web que se ejecuta en el equipo de desarrollo. El reenvío de puertos funciona mediante la creación de un puerto TCP de escucha en el dispositivo Android que se asigna a un puerto TCP en la máquina de desarrollo.

El tráfico entre los puertos se desplaza a través de la conexión USB entre el dispositivo Android y el equipo de desarrollo, por lo que la conexión no depende de la configuración de red.

Para habilitar el reenvío de puertos:

  1. Configure la depuración remota entre la máquina de desarrollo y el dispositivo Android. Cuando haya terminado, el dispositivo Android debe mostrarse en el menú izquierdo del cuadro de diálogo Inspeccionar dispositivos y un indicador de estado conectado .

  2. En el cuadro de diálogo Inspeccionar dispositivos de DevTools, habilite El reenvío de puertos.

  3. Haga clic en Agregar regla.

    Adición de una regla de reenvío de puertos

  4. En el cuadro de texto Puerto de dispositivo de la izquierda, escriba el número de puerto desde el localhost que desea poder acceder al sitio en el dispositivo Android. Por ejemplo, si desea tener acceso al sitio desde localhost:5000 escriba 5000.

  5. En el cuadro de texto Dirección local de la derecha, escriba la dirección IP o el nombre de host en el que se hospeda el sitio en el servidor web que se ejecuta en el equipo de desarrollo, seguido del número de puerto. Por ejemplo, si el sitio se ejecuta en localhost:7331 , escriba localhost:7331.

  6. Haga clic en Agregar.

El reenvío de puertos ya está configurado.

Puede ver el indicador de estado del puerto hacia delante en la parte superior, así como junto al nombre del dispositivo. El indicador para el reenvío de puertos está en la pestaña del dispositivo en el cuadro de diálogo Inspeccionar dispositivos .

Estado del reenvío de puertos

Para ver el contenido, abra Microsoft Edge en el dispositivo Android y vaya al localhost puerto que especificó en el campo Puerto del dispositivo. Por ejemplo, si ha escrito 5000 en el campo, visite localhost:5000.

Asignación a dominios locales personalizados

La asignación de dominio personalizada permite ver contenido en un dispositivo Android desde un servidor web en el equipo de desarrollo que usa un dominio personalizado.

Por ejemplo, supongamos que el sitio usa una biblioteca de JavaScript de terceros que solo funciona en el dominio microsoft-edge.devtools. Por lo tanto, cree una entrada en el hosts archivo en la máquina de desarrollo a la que asignar este dominio localhost (por ejemplo, 127.0.0.1 microsoft-edge.devtools). Después de configurar la asignación de dominio personalizada y el reenvío de puertos, vea el sitio en el dispositivo Android en la dirección URL microsoft-edge.devtools.

Configuración del reenvío de puertos al servidor proxy

Para asignar un dominio personalizado, debe ejecutar un servidor proxy en el equipo de desarrollo. Algunos ejemplos de servidores proxy son Charles, Squid y Fiddler.

Para configurar el reenvío de puertos a un proxy:

  1. Ejecute el servidor proxy y registre el puerto que está usando.

    Nota:

    El servidor proxy y el servidor web deben ejecutarse en puertos diferentes.

  2. Configure el reenvío de puertos al dispositivo Android. En el campo de dirección local , escriba localhost: seguido del puerto en el que se ejecuta el servidor proxy. Por ejemplo, si se ejecuta en el puerto 8000, vaya a localhost:8000. En el campo puerto del dispositivo , escriba el número en el que desea que el dispositivo Android escuche, como 3333.

Configuración del proxy en el dispositivo

A continuación, debe configurar el dispositivo Android para comunicarse con el servidor proxy.

  1. En el dispositivo Android, vaya a Configuración>Wi-Fi.

  2. Presione el nombre de la red a la que está conectado actualmente.

    Nota:

    La configuración de proxy se aplica por red.

  3. Haga clic en Modificar red.

  4. Haga clic en Opciones avanzadas. Se muestra la configuración del proxy.

  5. Haga clic en el menú Proxy y, a continuación, seleccione Manual.

  6. En el campo Nombre de host del proxy , escriba localhost.

  7. En el campo Puerto de proxy , escriba el número de puerto que especificó para el puerto del dispositivo en la sección anterior.

  8. Haga clic en Guardar.

Con esta configuración, el dispositivo reenvía todas sus solicitudes al proxy de la máquina de desarrollo. El proxy realiza solicitudes en nombre del dispositivo, por lo que las solicitudes al dominio local personalizado se resuelven correctamente.

Ahora acceda a dominios personalizados en el dispositivo Android como en la máquina de desarrollo.

Si el servidor web se está ejecutando fuera de un puerto no estándar, no olvide especificar el puerto al solicitar el contenido desde el dispositivo Android. Por ejemplo, si el servidor web usa el dominio microsoft-edge.devtools personalizado en el puerto 7331, al ver el sitio desde el dispositivo Android debe usar la dirección URL microsoft-edge.devtools:7331.

Sugerencia

Para reanudar la exploración normal, recuerde revertir la configuración del proxy en el dispositivo Android después de desconectarse de la máquina de desarrollo.

Nota:

Las partes de esta página son modificaciones basadas en el trabajo creado y compartido por Google y usadas según los términos descritos en la licencia internacional creative Commons Attribution 4.0. La página original se encuentra aquí y está creada por Kayce Basques y Meggin Kearney.

Licencia de Creative Commons Esta obra está licenciada bajo una Licencia Internacional Creative Commons Attribution 4.0.