可通过Remote-SSH扩展或GitHub Codespaces扩展连接远程环境,同步设置与扩展,代理本地文件系统,并支持断开保留实例状态。

如果您希望在本地 VSCode 编辑器中无缝连接并操作远程 GitHub Codespaces 环境,则可能是由于本地与远程开发环境未正确配置或认证失效。以下是实现协同工作的具体步骤:
本文运行环境:MacBook Air,macOS Sequoia。
一、通过 VSCode 远程 SSH 扩展连接 Codespace
GitHub Codespaces 提供了基于 SSH 的访问方式,VSCode 可通过 Remote - SSH 扩展直接接入运行中的 Codespace 实例,实现本地界面操作远程容器。
1、在 GitHub.com 上打开目标仓库,点击 Code 按钮,选择 Codespaces 选项卡,点击 New codespace 创建或选择已有实例。
2、在 Codespace 页面右上角点击 Open in Visual Studio Code,若未安装桌面版 VSCode,系统将提示下载并安装。
3、安装完成后,VSCode 自动启动并弹出连接提示;若未弹出,可手动执行命令面板(Cmd+Shift+P),输入 Remote-SSH: Connect to Host...,选择 GitHub Codespaces 条目。
4、首次连接时,VSCode 将自动下载并部署 VS Code Server 到 Codespace 容器内,并同步已启用的扩展设置。
二、使用 GitHub Codespaces 扩展直连
GitHub 官方提供的 VS Code 扩展可绕过 SSH 配置流程,直接从本地 VSCode 启动、管理及连接 Codespaces,适用于未预装 SSH 密钥或受限网络环境。
1、在 VSCode 中打开扩展市场,搜索并安装 GitHub Codespaces 扩展。
2、安装后重启 VSCode,点击左侧活动栏的 Codespaces 图标(云朵形状),或使用命令面板输入 Codespaces: Create New Codespace。
3、选择目标组织、仓库及分支,指定机器类型(如 2-core 或 4-core),点击创建。
4、创建完成后,VSCode 自动建立连接,工作区加载远程文件系统,终端默认指向 Codespace 容器内部 Shell。
三、同步本地设置与扩展到 Codespace
VSCode 支持将用户设置、快捷键、代码片段及已安装扩展自动同步至 Codespace,确保开发体验一致,无需重复配置。
可以学到如何使用PHP5显示动态网页,构建联系人管理系统、产生客户报告、与XML协同工作等,英文,原名称PHP 5 Fast and Easy Web Development
1、在本地 VSCode 中启用设置同步:点击左下角齿轮图标 → Settings Sync → Turn On → 使用 GitHub 账户登录。
2、在 Codespace 连接状态下,点击命令面板,执行 Settings Sync: Turn On...,选择同一 GitHub 账户完成同步初始化。
3、同步完成后,VSCode 自动安装与本地匹配的扩展列表,并应用 keybindings.json、settings.json 和 snippets 目录内容。
四、在 Codespace 中使用本地文件系统代理
当需要在 Codespace 内直接读写本地磁盘上的非仓库文件(如密钥、配置模板或大型测试数据)时,可通过 VSCode 的 Port Forwarding 与本地代理服务桥接路径访问。
1、在本地启动一个轻量 HTTP 文件服务器,例如执行 npx http-server -p 8080(需提前安装 Node.js)。
2、在 VSCode 命令面板中执行 Ports: Forward a Port from the Active Remote Machine,输入本地端口 8080。
3、VSCode 自动在 Codespace 终端中映射该端口,可在 Codespace 内通过 curl http://localhost:8080/ 访问本地目录下的文件。
五、断开与 Codespace 的连接并保留状态
VSCode 支持优雅断开连接而不终止 Codespace 实例,便于后续恢复开发会话,同时避免因误关闭导致环境销毁。
1、在 VSCode 窗口右下角状态栏,点击远程连接指示器(显示为 Codespaces + 仓库名)。
2、在弹出菜单中选择 Close Remote Connection,当前窗口将退回到本地空工作区。
3、前往 GitHub.com 的 Codespaces 页面,确认对应实例状态仍为 Running,而非 Stopped 或 Deleted。
4、再次从 VSCode 扩展面板或命令面板选择该 Codespace,即可重新连接并恢复终端、调试会话与未保存编辑器状态。









