# Solucionar problemas de los clientes de GitHub Codespaces

En este artículo se proporciona información para solucionar problemas que puedes encontrar con el cliente que usas para GitHub Codespaces.

<div class="ghd-tool webui">

## Solución de problemas del cliente web de Visual Studio Code

Si tiene problemas con el uso de GitHub Codespaces en un explorador que no está basado en Chromium, intente cambiar a un explorador basado en Chromium, como Google Chrome o Microsoft Edge. De forma alternativa, puedes buscar incidencias conocidas con el explorador en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen); para ello, busca incidencias etiquetadas con el nombre del explorador, como [`firefox`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+label%3Afirefox) o [`safari`](https://github.com/Microsoft/vscode/issues?q=is%3Aopen+is%3Aissue+label%3Asafari).

Si tienes problemas al usar GitHub Codespaces en un explorador basado en Chromium, puedes comprobar si experimenta otra incidencia conocida con VS Code en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen).

### Diferencias al trabajar localmente en VS Code

Al abrir un codespace en el explorador, con el cliente web de VS Code, observarás algunas diferencias con respecto a trabajar en un área de trabajo local en la aplicación de escritorio de VS Code. Por ejemplo, algunas combinaciones de teclas pueden ser diferentes o pueden faltar, y algunas extensiones podrían comportarse de forma diferente. Para obtener un resumen, consulta [Limitaciones conocidas y adaptaciones](https://code.visualstudio.com/docs/remote/codespaces#_known-limitations-and-adaptations) en la documentación de VS Code.

Puedes comprobar si hay incidencias conocidas y registrar nuevas incidencias con la experiencia de VS Code en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+codespaces).

### Visual Studio Code Insiders

Visual Studio Code Insiders es el lanzamiento más frecuente de VS Code. Tiene todas las características y correcciones de errores más recientes, pero también podría contener, ocasionalmente, problemas nuevos que podrían dar como resultado una compilación rota.

Si estás utilizando una compilación de Insiders y notas un comportamiento anormal, te recomendamos cambiar a la versión estable de Visual Studio Code e intentarlo de nuevo.

Haz clic en <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-gear" aria-label="Manage" role="img"><path d="M8 0a8.2 8.2 0 0 1 .701.031C9.444.095 9.99.645 10.16 1.29l.288 1.107c.018.066.079.158.212.224.231.114.454.243.668.386.123.082.233.09.299.071l1.103-.303c.644-.176 1.392.021 1.82.63.27.385.506.792.704 1.218.315.675.111 1.422-.364 1.891l-.814.806c-.049.048-.098.147-.088.294.016.257.016.515 0 .772-.01.147.038.246.088.294l.814.806c.475.469.679 1.216.364 1.891a7.977 7.977 0 0 1-.704 1.217c-.428.61-1.176.807-1.82.63l-1.102-.302c-.067-.019-.177-.011-.3.071a5.909 5.909 0 0 1-.668.386c-.133.066-.194.158-.211.224l-.29 1.106c-.168.646-.715 1.196-1.458 1.26a8.006 8.006 0 0 1-1.402 0c-.743-.064-1.289-.614-1.458-1.26l-.289-1.106c-.018-.066-.079-.158-.212-.224a5.738 5.738 0 0 1-.668-.386c-.123-.082-.233-.09-.299-.071l-1.103.303c-.644.176-1.392-.021-1.82-.63a8.12 8.12 0 0 1-.704-1.218c-.315-.675-.111-1.422.363-1.891l.815-.806c.05-.048.098-.147.088-.294a6.214 6.214 0 0 1 0-.772c.01-.147-.038-.246-.088-.294l-.815-.806C.635 6.045.431 5.298.746 4.623a7.92 7.92 0 0 1 .704-1.217c.428-.61 1.176-.807 1.82-.63l1.102.302c.067.019.177.011.3-.071.214-.143.437-.272.668-.386.133-.066.194-.158.211-.224l.29-1.106C6.009.645 6.556.095 7.299.03 7.53.01 7.764 0 8 0Zm-.571 1.525c-.036.003-.108.036-.137.146l-.289 1.105c-.147.561-.549.967-.998 1.189-.173.086-.34.183-.5.29-.417.278-.97.423-1.529.27l-1.103-.303c-.109-.03-.175.016-.195.045-.22.312-.412.644-.573.99-.014.031-.021.11.059.19l.815.806c.411.406.562.957.53 1.456a4.709 4.709 0 0 0 0 .582c.032.499-.119 1.05-.53 1.456l-.815.806c-.081.08-.073.159-.059.19.162.346.353.677.573.989.02.03.085.076.195.046l1.102-.303c.56-.153 1.113-.008 1.53.27.161.107.328.204.501.29.447.222.85.629.997 1.189l.289 1.105c.029.109.101.143.137.146a6.6 6.6 0 0 0 1.142 0c.036-.003.108-.036.137-.146l.289-1.105c.147-.561.549-.967.998-1.189.173-.086.34-.183.5-.29.417-.278.97-.423 1.529-.27l1.103.303c.109.029.175-.016.195-.045.22-.313.411-.644.573-.99.014-.031.021-.11-.059-.19l-.815-.806c-.411-.406-.562-.957-.53-1.456a4.709 4.709 0 0 0 0-.582c-.032-.499.119-1.05.53-1.456l.815-.806c.081-.08.073-.159.059-.19a6.464 6.464 0 0 0-.573-.989c-.02-.03-.085-.076-.195-.046l-1.102.303c-.56.153-1.113.008-1.53-.27a4.44 4.44 0 0 0-.501-.29c-.447-.222-.85-.629-.997-1.189l-.289-1.105c-.029-.11-.101-.143-.137-.146a6.6 6.6 0 0 0-1.142 0ZM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9.5 8a1.5 1.5 0 1 0-3.001.001A1.5 1.5 0 0 0 9.5 8Z"></path></svg> en la parte inferior izquierda del editor y selecciona **Cambiar a versión estable...** . Si el cliente web de VS Code no se carga o <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-gear" aria-label="Manage" role="img"><path d="M8 0a8.2 8.2 0 0 1 .701.031C9.444.095 9.99.645 10.16 1.29l.288 1.107c.018.066.079.158.212.224.231.114.454.243.668.386.123.082.233.09.299.071l1.103-.303c.644-.176 1.392.021 1.82.63.27.385.506.792.704 1.218.315.675.111 1.422-.364 1.891l-.814.806c-.049.048-.098.147-.088.294.016.257.016.515 0 .772-.01.147.038.246.088.294l.814.806c.475.469.679 1.216.364 1.891a7.977 7.977 0 0 1-.704 1.217c-.428.61-1.176.807-1.82.63l-1.102-.302c-.067-.019-.177-.011-.3.071a5.909 5.909 0 0 1-.668.386c-.133.066-.194.158-.211.224l-.29 1.106c-.168.646-.715 1.196-1.458 1.26a8.006 8.006 0 0 1-1.402 0c-.743-.064-1.289-.614-1.458-1.26l-.289-1.106c-.018-.066-.079-.158-.212-.224a5.738 5.738 0 0 1-.668-.386c-.123-.082-.233-.09-.299-.071l-1.103.303c-.644.176-1.392-.021-1.82-.63a8.12 8.12 0 0 1-.704-1.218c-.315-.675-.111-1.422.363-1.891l.815-.806c.05-.048.098-.147.088-.294a6.214 6.214 0 0 1 0-.772c.01-.147-.038-.246-.088-.294l-.815-.806C.635 6.045.431 5.298.746 4.623a7.92 7.92 0 0 1 .704-1.217c.428-.61 1.176-.807 1.82-.63l1.102.302c.067.019.177.011.3-.071.214-.143.437-.272.668-.386.133-.066.194-.158.211-.224l.29-1.106C6.009.645 6.556.095 7.299.03 7.53.01 7.764 0 8 0Zm-.571 1.525c-.036.003-.108.036-.137.146l-.289 1.105c-.147.561-.549.967-.998 1.189-.173.086-.34.183-.5.29-.417.278-.97.423-1.529.27l-1.103-.303c-.109-.03-.175.016-.195.045-.22.312-.412.644-.573.99-.014.031-.021.11.059.19l.815.806c.411.406.562.957.53 1.456a4.709 4.709 0 0 0 0 .582c.032.499-.119 1.05-.53 1.456l-.815.806c-.081.08-.073.159-.059.19.162.346.353.677.573.989.02.03.085.076.195.046l1.102-.303c.56-.153 1.113-.008 1.53.27.161.107.328.204.501.29.447.222.85.629.997 1.189l.289 1.105c.029.109.101.143.137.146a6.6 6.6 0 0 0 1.142 0c.036-.003.108-.036.137-.146l.289-1.105c.147-.561.549-.967.998-1.189.173-.086.34-.183.5-.29.417-.278.97-.423 1.529-.27l1.103.303c.109.029.175-.016.195-.045.22-.313.411-.644.573-.99.014-.031.021-.11-.059-.19l-.815-.806c-.411-.406-.562-.957-.53-1.456a4.709 4.709 0 0 0 0-.582c-.032-.499.119-1.05.53-1.456l.815-.806c.081-.08.073-.159.059-.19a6.464 6.464 0 0 0-.573-.989c-.02-.03-.085-.076-.195-.046l-1.102.303c-.56.153-1.113.008-1.53-.27a4.44 4.44 0 0 0-.501-.29c-.447-.222-.85-.629-.997-1.189l-.289-1.105c-.029-.11-.101-.143-.137-.146a6.6 6.6 0 0 0-1.142 0ZM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9.5 8a1.5 1.5 0 1 0-3.001.001A1.5 1.5 0 0 0 9.5 8Z"></path></svg> no está disponible, puedes forzar el cambio a Visual Studio Code estable si anexas `?vscodeChannel=stable` a la dirección URL de tu codespace y lo cargas en ella.

Si la incidencia no se ha corregido en Visual Studio Code Estable, comprueba si hay incidencias conocidas y, si es necesario, registra una nueva incidencia con la experiencia de VS Code, en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+codespaces).

### Solución de problemas de Simple Browser

Cuando hayas iniciado una aplicación web en un codespace, puedes obtener una vista previa de la aplicación en ejecución en el explorador Simple Browser insertado en VS Code. En algunos proyectos, la aplicación se abre automáticamente en una pestaña de Simple Browser en el editor cuando se inicia la aplicación. Esto sucede si, en el archivo de configuración `devcontainer.json` del codespace, la propiedad `onAutoForward` del puerto en el que se ejecuta la aplicación está establecida en `openPreview`.

```json
"portsAttributes": {
  "3000": {
    "label": "Application",
    "onAutoForward": "openPreview"
  }
}
```

Si la pestaña de Simple Browser no se abre automáticamente, puedes abrir Simple Browser de forma manual para ver la aplicación.

1. En VS Code, haz clic en la pestaña **Puertos**.
2. Haz clic con el botón derecho en el puerto y, luego, haz clic en **Vista previa en el Editor**.

   ![Captura de pantalla del menú emergente en la pestaña Puertos de VS Code. La entrada de menú «Vista previa en el Editor» está resaltada con un contorno naranja oscuro.](/assets/images/help/codespaces/preview-in-editor-vscode.png)

#### La pestaña de Simple Browser no se abre automáticamente

Si el archivo de configuración `devcontainer.json` especifica `"onAutoForward": "openPreview"` para un puerto, pero Simple Browser no se abre automáticamente cuando se inicia una aplicación, comprueba que la aplicación se ha iniciado en el puerto especificado en la configuración. La aplicación podría iniciarse en un puerto diferente si el puerto previsto está ocupado.

Para implementar la configuración de puerto especificada en `devcontainer.json`, GitHub Codespaces escribe la configuración en el archivo `settings.json` de VS Code cuando se crea un codespace. Puedes comprobar que la configuración se ha escrito correctamente en `settings.json` en el codespace.

1. En el terminal del codespace, escribe el comando siguiente.

   ```bash copy
   cat ~/.vscode-remote/data/Machine/settings.json
   ```

2. Comprueba que el archivo `settings.json` contiene líneas como las siguientes.

   ```json
    "remote.portsAttributes": {
        "3000": {
            "label": "Application",
            "onAutoForward": "openPreview"
        }
    }
   ```

Si el archivo `settings.json` no contiene esta configuración, comprueba si tienes dotfiles habilitados y si alguna configuración de los dotfiles está sobrescribiendo el archivo `settings.json`. Para más información, consulta [Personalización de GitHub Codespaces para su cuenta](/es/codespaces/setting-your-user-preferences/personalizing-github-codespaces-for-your-account#dotfiles).

#### La aplicación no se carga

En ocasiones, es posible que la pestaña de Simple Browser se abra, pero muestre un icono de página de error o una página en blanco en lugar de la aplicación en ejecución. Esto puede ocurrir si la aplicación web que estás cargando incluye una directiva de seguridad de contenido (CSP) que restringe los dominios en los que se pueden insertar las páginas del sitio. Para obtener más información, consulta [CSP: frame-ancestors](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors) en el sitio web de MDN.

Es posible que puedas cambiar la directiva de seguridad `frame-ancestors` de la aplicación localmente para que la aplicación se muestre en Simple Browser. Como alternativa, si una directiva `frame-ancestors` está causando el problema, deberías poder ver la aplicación si la abres en una pestaña del explorador habitual, en lugar de en Simple Browser. Para ello, haz clic en la pestaña **Puertos** de VS Code, haz clic con el botón derecho en el puerto y haz clic en **Abrir en el explorador**.

</div>

<div class="ghd-tool vscode">

## Solución de problemas de VS Code

Al abrir un codespace en la aplicación de escritorio de VS Code, es posible que observes algunas diferencias en comparación con trabajar en un área de trabajo local, pero la experiencia debe ser similar.

Si encuentras incidencias, puedes comprobar si hay incidencias conocidas y registrar nuevas incidencias con la experiencia de VS Code en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+codespaces).

### Visual Studio Code Insiders

Visual Studio Code Insiders es el lanzamiento más frecuente de VS Code. Tiene todas las características y correcciones de errores más recientes, pero también podría contener, ocasionalmente, problemas nuevos que podrían dar como resultado una compilación rota.

Si estás utilizando una compilación de Insiders y notas un comportamiento anormal, te recomendamos cambiar a la versión estable de Visual Studio Code e intentarlo de nuevo.

Para cambiar a Visual Studio Code Estable, cierra la aplicación de Visual Studio Code Insiders, abre la aplicación de Visual Studio Code Estable y vuelve a abrir el codespace.

Si la incidencia no se ha corregido en Visual Studio Code Estable, comprueba si hay incidencias conocidas y, si es necesario, registra una nueva incidencia con la experiencia de VS Code, en el repositorio [`microsoft/vscode`](https://github.com/microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+codespaces).

### Solución de problemas de Simple Browser

Cuando hayas iniciado una aplicación web en un codespace, puedes obtener una vista previa de la aplicación en ejecución en el explorador Simple Browser insertado en VS Code. En algunos proyectos, la aplicación se abre automáticamente en una pestaña de Simple Browser en el editor cuando se inicia la aplicación. Esto sucede si, en el archivo de configuración `devcontainer.json` del codespace, la propiedad `onAutoForward` del puerto en el que se ejecuta la aplicación está establecida en `openPreview`.

```json
"portsAttributes": {
  "3000": {
    "label": "Application",
    "onAutoForward": "openPreview"
  }
}
```

Si la pestaña de Simple Browser no se abre automáticamente, puedes abrir Simple Browser de forma manual para ver la aplicación.

1. En VS Code, haz clic en la pestaña **Puertos**.
2. Haz clic con el botón derecho en el puerto y, luego, haz clic en **Vista previa en el Editor**.

   ![Captura de pantalla del menú emergente en la pestaña Puertos de VS Code. La entrada de menú «Vista previa en el Editor» está resaltada con un contorno naranja oscuro.](/assets/images/help/codespaces/preview-in-editor-vscode.png)

#### La pestaña de Simple Browser no se abre automáticamente

Si el archivo de configuración `devcontainer.json` especifica `"onAutoForward": "openPreview"` para un puerto, pero Simple Browser no se abre automáticamente cuando se inicia una aplicación, comprueba que la aplicación se ha iniciado en el puerto especificado en la configuración. La aplicación podría iniciarse en un puerto diferente si el puerto previsto está ocupado.

Para implementar la configuración de puerto especificada en `devcontainer.json`, GitHub Codespaces escribe la configuración en el archivo `settings.json` de VS Code cuando se crea un codespace. Puedes comprobar que la configuración se ha escrito correctamente en `settings.json` en el codespace.

1. En el terminal del codespace, escribe el comando siguiente.

   ```bash copy
   cat ~/.vscode-remote/data/Machine/settings.json
   ```

2. Comprueba que el archivo `settings.json` contiene líneas como las siguientes.

   ```json
    "remote.portsAttributes": {
        "3000": {
            "label": "Application",
            "onAutoForward": "openPreview"
        }
    }
   ```

Si el archivo `settings.json` no contiene esta configuración, comprueba si tienes dotfiles habilitados y si alguna configuración de los dotfiles está sobrescribiendo el archivo `settings.json`. Para más información, consulta [Personalización de GitHub Codespaces para su cuenta](/es/codespaces/setting-your-user-preferences/personalizing-github-codespaces-for-your-account#dotfiles).

#### La aplicación no se carga

En ocasiones, es posible que la pestaña de Simple Browser se abra, pero muestre un icono de página de error o una página en blanco en lugar de la aplicación en ejecución. Esto puede ocurrir si la aplicación web que estás cargando incluye una directiva de seguridad de contenido (CSP) que restringe los dominios en los que se pueden insertar las páginas del sitio. Para obtener más información, consulta [CSP: frame-ancestors](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors) en el sitio web de MDN.

Es posible que puedas cambiar la directiva de seguridad `frame-ancestors` de la aplicación localmente para que la aplicación se muestre en Simple Browser. Como alternativa, si una directiva `frame-ancestors` está causando el problema, deberías poder ver la aplicación si la abres en una pestaña del explorador habitual, en lugar de en Simple Browser. Para ello, haz clic en la pestaña **Puertos** de VS Code, haz clic con el botón derecho en el puerto y haz clic en **Abrir en el explorador**.

</div>