Puedes reenviar los puertos en tu codespace para probar y depurar tu aplicación. También puedes administrar el protocolo de puerto y compartirlo dentro de tu organización o públicamente.
La redirección de puertos te otorga acceso a los puertos CRP dentro de tu codespace. Por ejemplo, si estás ejecutando una aplicación web en un puerto específico en tu codespace, puedes reenviar dicho puerto. Esto te permite acceder a la aplicación desde el buscador en tu máquina local para hacer pruebas y correcciones de errores.
Cuando una aplicación que se ejecuta dentro de un codespace imprime la salida en el terminal que contiene una dirección URL de localhost, como http://localhost:PORT o http://127.0.0.1:PORT, el puerto se reenvía de forma automática. Si estás utilizando GitHub Codespaces en el explorador o en Visual Studio Code, la secuencia de URL en la terminal se convertirá en un vínculo en el que puedes hacer clic para ver la página web en tu máquina local. De manera predeterminada, GitHub Codespaces reenvía los puertos mediante HTTP.
Puedes editar la configuración del contenedor de desarrollo para que el repositorio reenvíe automáticamente uno o varios puertos. También puedes reenviar un puerto de forma manual, etiquetar los puertos reenviados, compartir los puertos reenviados con los miembros de tu organización, compartir los puertos reenviados de forma pública y agregar puertos reenviados a la configuración del codespace.
Note
Los propietarios de la organización pueden restringir la capacidad de hacer que los puertos de reenvío estén disponibles públicamente o dentro de la organización. Para más información, consulta Restricción de la visibilidad de los puertos reenviados.
De manera predeterminada, GitHub Codespaces reenvía los puertos mediante HTTP, pero puedes actualizar cualquier puerto para que utilice HTTPS según sea necesario. Si actualizas un puerto con visibilidad pública para usar HTTPS, la visibilidad del puerto cambiará automáticamente a privada.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres actualizar y, después, mantén el ratón sobre Cambiar protocolo de puerto.
Selecciona el protocolo necesario para este puerto. El protocolo que selecciones se recordará para este puerto durante toda la vida útil del codespace.
Solo puedes hacer que un puerto sea privado para una organización si en la organización se usa GitHub Team o GitHub Enterprise Cloud.
Si quieres compartir un puerto reenviado con otros, puedes ya sea hacerlo privado para tu organización o hacerlo público. Después de hacer un puerto privado para tu organización, cualquier miembro de esta que tenga la URL de dicho puerto podrá ver la aplicación que se está ejecutando. Después de hacer un puerto público, cualquiera que sepa la URL y el número de puerto podrá ver la aplicación que se está ejecutando sin necesidad de autenticarse.
Haz clic con el botón derecho en el puerto que quieres compartir, haz clic en Visibilidad del puerto y, después, en Privado para la organización o Público.
A la derecha de la dirección local del puerto, haz clic en el icono de copiar.
Envía la URL copiada a la persona con la que quieras compartir el puerto.
Al reenviar un puerto, tu aplicación pasa a estar disponible en la dirección URL https://CODESPACENAME-PORT.app.github.dev. Por ejemplo, https://monalisa-hot-potato-vrpqrxxrx7x2rxx-4000.app.github.dev. Si reenvías un puerto privado desde la aplicación de escritorio de VS Code, tu aplicación también está disponible en un puerto localhost, como 127.0.0.1:4000.
Para acceder a tu aplicación mediante un cliente REST (como Postman) o una herramienta de línea de comandos (como curl), no necesitas autenticarte si usas un puerto localhost o si accedes a un puerto público en el dominio remoto. Sin embargo, para conectarte a un puerto privado en el dominio remoto, debes autenticarte mediante el token de acceso GITHUB_TOKEN en la solicitud.
Note
El elemento GITHUB_TOKEN se crea automáticamente al iniciar un codespace y no cambia durante la sesión del codespace. Si detienes y luego reinicias un codespace, se genera un nuevo GITHUB_TOKEN.
Puede agregar un puerto reenviado a la configuración de GitHub Codespaces del repositorio para que se pueda reenviar automáticamente el puerto a todos los codespaces creados a partir del repositorio. Después de que actualizas la configuración, cualquier codespace creado debe reconstruirse para que el cambio se aplique. Para más información sobre el archivo de configuración de contenedores de desarrollo, consulta Introducción a los contenedores dev.
En el codespace, abre el archivo de configuración del contenedor de desarrollo que quieres actualizar. Normalmente, este archivo es .devcontainer/devcontainer.json.
Agregue la propiedad forwardPorts.
"forwardPorts":[NUMBER],
Reemplaza NUMBER por el número de puerto que quieres reenviar. Puede ser una lista separada por comas de números de puerto.
Al abrir un codespace en el explorador o en la aplicación de escritorio VS Code, puedes etiquetar un puerto reenviado para facilitar la identificación en una lista.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres etiquetar y elige Establecer etiqueta de puerto.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Puedes etiquetar un puerto y escribir el cambio en un archivo de configuración de contenedor de desarrollo para el repositorio. Si lo haces para un puerto que se reenvía automáticamente (con la propiedad forwardPorts), la etiqueta se aplica automáticamente a ese puerto reenviado para todos los codespaces futuros creados a partir del repositorio con ese archivo de configuración.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres agregar a la configuración del codespace y elige Establecer etiqueta y actualizar devcontainer.json.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Si el repositorio tiene más de un archivo de configuración de contenedor de desarrollo, se te pedirá que elijas el archivo que quieres actualizar.
El archivo de configuración del contenedor de desarrollo se actualiza para incluir la nueva etiqueta en la propiedad portsAttributes. Por ejemplo:
// Use 'forwardPorts' to make a list of ports inside the container available locally."forwardPorts":[3333,4444],"portsAttributes":{"3333":{"label":"app-standard-preview"},"4444":{"label":"app-pro-preview"}}
Cuando una aplicación que se ejecuta dentro de un codespace imprime la salida en el terminal que contiene una dirección URL de localhost, como http://localhost:PORT o http://127.0.0.1:PORT, el puerto se reenvía de forma automática. Si estás utilizando GitHub Codespaces en el explorador o en Visual Studio Code, la secuencia de URL en la terminal se convertirá en un vínculo en el que puedes hacer clic para ver la página web en tu máquina local. De manera predeterminada, GitHub Codespaces reenvía los puertos mediante HTTP.
Puedes editar la configuración del contenedor de desarrollo para que el repositorio reenvíe automáticamente uno o varios puertos. También puedes reenviar un puerto de forma manual, etiquetar los puertos reenviados, compartir los puertos reenviados con los miembros de tu organización, compartir los puertos reenviados de forma pública y agregar puertos reenviados a la configuración del codespace.
Note
Los propietarios de la organización pueden restringir la capacidad de hacer que los puertos de reenvío estén disponibles públicamente o dentro de la organización. Para más información, consulta Restricción de la visibilidad de los puertos reenviados.
Solo puedes hacer que un puerto sea privado para una organización si en la organización se usa GitHub Team o GitHub Enterprise Cloud.
Si quieres compartir un puerto reenviado con otros, puedes ya sea hacerlo privado para tu organización o hacerlo público. Después de hacer un puerto privado para tu organización, cualquier miembro de esta que tenga la URL de dicho puerto podrá ver la aplicación que se está ejecutando. Después de hacer un puerto público, cualquiera que sepa la URL y el número de puerto podrá ver la aplicación que se está ejecutando sin necesidad de autenticarse.
Haz clic con el botón derecho en el puerto que quieres compartir, haz clic en Visibilidad del puerto y, después, en Privado para la organización o Público.
A la derecha de la dirección local del puerto, haz clic en el icono de copiar.
Envía la URL copiada a la persona con la que quieras compartir el puerto.
Al reenviar un puerto, tu aplicación pasa a estar disponible en la dirección URL https://CODESPACENAME-PORT.app.github.dev. Por ejemplo, https://monalisa-hot-potato-vrpqrxxrx7x2rxx-4000.app.github.dev. Si reenvías un puerto privado desde la aplicación de escritorio de VS Code, tu aplicación también está disponible en un puerto localhost, como 127.0.0.1:4000.
Para acceder a tu aplicación mediante un cliente REST (como Postman) o una herramienta de línea de comandos (como curl), no necesitas autenticarte si usas un puerto localhost o si accedes a un puerto público en el dominio remoto. Sin embargo, para conectarte a un puerto privado en el dominio remoto, debes autenticarte mediante el token de acceso GITHUB_TOKEN en la solicitud.
Note
El elemento GITHUB_TOKEN se crea automáticamente al iniciar un codespace y no cambia durante la sesión del codespace. Si detienes y luego reinicias un codespace, se genera un nuevo GITHUB_TOKEN.
Puede agregar un puerto reenviado a la configuración de GitHub Codespaces del repositorio para que se pueda reenviar automáticamente el puerto a todos los codespaces creados a partir del repositorio. Después de que actualizas la configuración, cualquier codespace creado debe reconstruirse para que el cambio se aplique. Para más información sobre el archivo de configuración de contenedores de desarrollo, consulta Introducción a los contenedores dev.
En el codespace, abre el archivo de configuración del contenedor de desarrollo que quieres actualizar. Normalmente, este archivo es .devcontainer/devcontainer.json.
Agregue la propiedad forwardPorts.
"forwardPorts":[NUMBER],
Reemplaza NUMBER por el número de puerto que quieres reenviar. Puede ser una lista separada por comas de números de puerto.
Al abrir un codespace en el explorador o en la aplicación de escritorio VS Code, puedes etiquetar un puerto reenviado para facilitar la identificación en una lista.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres etiquetar y elige Establecer etiqueta de puerto.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Puedes etiquetar un puerto y escribir el cambio en un archivo de configuración de contenedor de desarrollo para el repositorio. Si lo haces para un puerto que se reenvía automáticamente (con la propiedad forwardPorts), la etiqueta se aplica automáticamente a ese puerto reenviado para todos los codespaces futuros creados a partir del repositorio con ese archivo de configuración.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres agregar a la configuración del codespace y elige Establecer etiqueta y actualizar devcontainer.json.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Si el repositorio tiene más de un archivo de configuración de contenedor de desarrollo, se te pedirá que elijas el archivo que quieres actualizar.
El archivo de configuración del contenedor de desarrollo se actualiza para incluir la nueva etiqueta en la propiedad portsAttributes. Por ejemplo:
// Use 'forwardPorts' to make a list of ports inside the container available locally."forwardPorts":[3333,4444],"portsAttributes":{"3333":{"label":"app-standard-preview"},"4444":{"label":"app-pro-preview"}}
Para reenviar un puerto, use el subcomando gh codespace ports forward. Reemplace codespace-port:local-port por los puertos remotos y locales que quiera conectar. Después de ingresar el comando, elige de la lista de codespaces que se muestra.
Solo puedes hacer que un puerto sea privado para una organización si en la organización se usa GitHub Team o GitHub Enterprise Cloud.
Si quieres compartir un puerto reenviado con otros, puedes ya sea hacerlo privado para tu organización o hacerlo público. Después de hacer un puerto privado para tu organización, cualquier miembro de esta que tenga la URL de dicho puerto podrá ver la aplicación que se está ejecutando. Después de hacer un puerto público, cualquiera que sepa la URL y el número de puerto podrá ver la aplicación que se está ejecutando sin necesidad de autenticarse.
Para cambiar la visibilidad de un puerto reenviado, use el subcomando gh codespace ports visibility. Existen tres ajustes de visibilidad:
private: solo es visible para usted. Este es el ajuste predeterminado cuando reenvías un puerto.
org: visible para los miembros de la organización propietaria del repositorio.
public: visible para cualquiera que conozca la URL y el número de puerto.
Reemplace codespace-port por el número de puerto reenviado. Reemplace setting por private, org o public. Después de ingresar el comando, elige de la lista de codespaces que se muestra.
Al reenviar un puerto, tu aplicación pasa a estar disponible en la dirección URL https://CODESPACENAME-PORT.app.github.dev. Por ejemplo, https://monalisa-hot-potato-vrpqrxxrx7x2rxx-4000.app.github.dev. Si reenvías un puerto privado desde la aplicación de escritorio de VS Code, tu aplicación también está disponible en un puerto localhost, como 127.0.0.1:4000.
Para acceder a tu aplicación mediante un cliente REST (como Postman) o una herramienta de línea de comandos (como curl), no necesitas autenticarte si usas un puerto localhost o si accedes a un puerto público en el dominio remoto. Sin embargo, para conectarte a un puerto privado en el dominio remoto, debes autenticarte mediante el token de acceso GITHUB_TOKEN en la solicitud.
Note
El elemento GITHUB_TOKEN se crea automáticamente al iniciar un codespace y no cambia durante la sesión del codespace. Si detienes y luego reinicias un codespace, se genera un nuevo GITHUB_TOKEN.
Para buscar la dirección de un puerto reenviado, escribe gh codespace ports. Si tienes más de un codespace, selecciona el codespace adecuado en la lista que se muestra.
Copia la dirección y pégala en algún lugar para usarla más adelante.
Puede agregar un puerto reenviado a la configuración de GitHub Codespaces del repositorio para que se pueda reenviar automáticamente el puerto a todos los codespaces creados a partir del repositorio. Después de que actualizas la configuración, cualquier codespace creado debe reconstruirse para que el cambio se aplique. Para más información sobre el archivo de configuración de contenedores de desarrollo, consulta Introducción a los contenedores dev.
En el codespace, abre el archivo de configuración del contenedor de desarrollo que quieres actualizar. Normalmente, este archivo es .devcontainer/devcontainer.json.
Agregue la propiedad forwardPorts.
"forwardPorts":[NUMBER],
Reemplaza NUMBER por el número de puerto que quieres reenviar. Puede ser una lista separada por comas de números de puerto.
Al abrir un codespace en el explorador o en la aplicación de escritorio VS Code, puedes etiquetar un puerto reenviado para facilitar la identificación en una lista.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres etiquetar y elige Establecer etiqueta de puerto.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Puedes etiquetar un puerto y escribir el cambio en un archivo de configuración de contenedor de desarrollo para el repositorio. Si lo haces para un puerto que se reenvía automáticamente (con la propiedad forwardPorts), la etiqueta se aplica automáticamente a ese puerto reenviado para todos los codespaces futuros creados a partir del repositorio con ese archivo de configuración.
Abre el terminal en tu codespace.
Haz clic en la pestaña PUERTOS.
Haz clic con el botón derecho en el puerto que quieres agregar a la configuración del codespace y elige Establecer etiqueta y actualizar devcontainer.json.
Teclea una etiqueta para tu puerto y luego presiona Entrar.
Si el repositorio tiene más de un archivo de configuración de contenedor de desarrollo, se te pedirá que elijas el archivo que quieres actualizar.
El archivo de configuración del contenedor de desarrollo se actualiza para incluir la nueva etiqueta en la propiedad portsAttributes. Por ejemplo:
// Use 'forwardPorts' to make a list of ports inside the container available locally."forwardPorts":[3333,4444],"portsAttributes":{"3333":{"label":"app-standard-preview"},"4444":{"label":"app-pro-preview"}}
Puedes ver las etiquetas de puerto al enumerar los puertos reenviados de un codespace. Para ello, usa el comando gh codespace ports y, después, selecciona un codespace.