对 GitHub Codespaces 客户端进行故障排除

对 Visual Studio Code Web 客户端进行故障排除

如果你在非 Chromium 内核的浏览器中使用 GitHub Codespaces 时遇到问题，请尝试切换到 Chromium 内核的浏览器，例如 Google Chrome 或 Microsoft Edge。或者，在 microsoft/vscode 存储库中搜索带有浏览器名称（如 firefox 或 safari）标签的问题，以了解已知问题。

如果你在 Chromium 内核的浏览器中使用 GitHub Codespaces 时遇到问题，可以在 microsoft/vscode 存储库中查看是否遇到了 VS Code 的其他已知问题。

与在本地 VS Code 中工作时的差异

在浏览器中使用 VS Code Web 客户端打开代码空间时，你会注意到与在 VS Code 桌面应用程序中本地工作空间中工作时存在一些差异。例如，某些键绑定会不同或缺失，某些扩展的行为可能不同。有关摘要，请参阅 VS Code 文档中的“已知限制和改编”。

你可以在 microsoft/vscode 存储库中查看已知问题并记录 VS Code 体验中的新问题。

Visual Studio Code Insiders

Visual Studio Code Insiders 是 VS Code 最频繁的版本。它具有所有最新的功能和错误修复，但也可能偶尔包含导致构建中断的新问题。

如果你正在使用 Insiders 版本并注意到行为中断，我们建议切换到 Visual Studio Code Stable 并重试。

单击 编辑器的左下角并选择切换到稳定版本...。如果 VS Code Web 客户端未加载，或 不可用，你可以通过将 ?vscodeChannel=stable 附加到你的代码空间 URL 并加载该 URL 中的代码空间来强制切换到 Visual Studio Code Stable。

如果问题在 Visual Studio Code Stable 中未得到解决，请检查已知问题，并在需要时在 microsoft/vscode 存储库中记录 VS Code 体验中的新问题。

对简单浏览器进行故障排除

在代码空间中启动 Web 应用程序时，可以在嵌入在 VS Code 中的简单浏览器中预览正在运行的应用程序。在某些项目中，应用程序在启动时会自动在编辑器中的简单浏览器选项卡中打开。如果在代码空间的 devcontainer.json 配置文件中，应用程序运行所在的端口的 onAutoForward 属性设置为 openPreview，则会发生这种情况。

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

如果简单浏览器标签未自动打开，你可以手动打开简单浏览器来查看应用程序。

1. 在 VS Code 中，单击端口标签。

2. 右键单击端口，然后单击在编辑器中预览。

   

简单浏览器标签未自动打开

如果 devcontainer.json 配置文件为某个端口指定了 "onAutoForward": "openPreview"，但在应用程序启动时简单浏览器未自动打开，请检查应用程序是否已在配置中指定的端口上启动。如果目标端口繁忙，应用程序可能会在其他端口上启动。

为了实现 devcontainer.json 中指定的端口配置，GitHub Codespaces 会在创建代码空间时将配置写入 VS Code 的 settings.json 文件。你可以检查配置是否已正确写入代码空间中的 settings.json。

1. 在代码空间的终端中，输入以下命令。

   Bash

   cat ~/.vscode-remote/data/Machine/settings.json
   

2. 验证 settings.json 文件是否包含如下行。

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

如果 settings.json 文件不包含这些设置，请检查你是否启用了 dotfiles，以及 dotfiles 中的任何配置是否覆盖了 settings.json 文件。有关详细信息，请参阅“针对你的帐户个性化 GitHub Codespaces”。

应用程序未加载

有时，你可能会发现简单浏览器标签已打开，但显示错误页面图标或空白页面，而不是正在运行的应用程序。如果正在加载的 Web 应用程序包含内容安全策略 (CSP)，并且该策略限制了可以嵌入网站页面的域，则会出现这种情况。有关详细信息，请参阅 mdn 网站上的CSP: frame-ancestors。

你可以在本地更改应用程序的 frame-ancestors 安全策略，以使应用程序在简单浏览器中显示。或者，如果 frame-ancestors 策略导致了问题，你应该能够通过在常规浏览器标签中打开应用程序（而不是简单浏览器）来查看应用程序。为此，请在 VS Code 中单击端口标签，右键单击端口，然后单击在浏览器中打开。