在 Visual Studio Code 中使用远程 SSH
2019年7月25日，作者 Sana Ajani，@sana_ajani
Remote - SSH：简单、流畅，且（像）本地开发一样
如果你错过了，Visual Studio Code 最近发布了远程开发扩展。这些远程扩展允许你针对容器、远程计算机或虚拟机 (VM) 以及适用于 Linux 的 Windows 子系统 (WSL) 进行开发，同时将具有全套功能的 VS Code 作为你的开发环境。
无限可能：你不再受限于本地计算机
越来越多的开发者在大型且复杂的项目上工作，这需要他们在专门的开发虚拟机或服务器上运行，这些机器比普通的笔记本电脑提供更多的存储空间或计算能力。
然而，这种开发方式也面临着不少挑战
- 如果你使用远程访问软件（如 VNC），在编辑时可能会感到延迟，因为 UI 不再是本地的。
- 如果你使用远程桌面协议 (RDP)，管理多个连接可能会很困难。
- 挂载远程文件系统并执行批量操作可能会很慢。
- 保持远程和本地环境同步很麻烦，而且你经常会遇到在一个地方可行但在另一个地方不行的问题。
- 使用 SSH 和 Vim 远程编辑文件意味着你不再处于熟悉的编码编辑器的舒适区。
如果能打破本地计算机的物理限制而不放弃你的工具，那该多好。现在，Remote - SSH 扩展的魔力来了。
在 Linux 上进行远程开发
只要你的 Linux 虚拟机支持 SSH，它可以托管在任何地方：本地主机、本地机房、Azure 或任何其他云端。你也可以在任何客户端上——Windows、macOS 或 Linux。
注意：目前尚不支持 macOS 和 Windows SSH 主机。
在这篇博客文章中，我们将使用 Windows 客户端并针对 Azure 上的 Linux 虚拟机进行操作。
开始使用
在开始之前，你需要完成以下操作
- 安装兼容 OpenSSH 的 SSH 客户端（不支持 PuTTY）。
- 安装 Visual Studio Code。
- 拥有 Azure 订阅（如果你没有 Azure 订阅，请在开始前创建一个免费账户）。
创建虚拟机
如果你还没有 Linux 虚拟机，可以通过 Azure 门户创建一个新虚拟机。在 Azure 门户中搜索“虚拟机”，然后选择添加。在那里，你可以选择你的 Azure 订阅，并创建一个新的资源组（如果你还没有资源组的话）。
现在你可以指定虚拟机的详细信息，例如名称、大小和基础镜像。在本示例中，我们将选择 Ubuntu Server 18.04 LTS，但你也可以选择其他 Linux 发行版的最新版本，并查看我们支持的 SSH 服务器。
设置 SSH
登录虚拟机有多种身份验证方法，包括 SSH 公钥/私钥对或用户名和密码。我们强烈建议使用基于密钥的身份验证，这样你就不需要每次连接时都输入密码。如果你在 Windows 上已经使用 PuttyGen 创建了密钥，可以重复使用它们。
如果你没有 SSH 密钥对，请打开 bash shell 或命令行并输入：
ssh-keygen -t ed25519
这将生成 SSH 密钥。在接下来的提示中按 Enter 键将密钥保存在默认位置。
然后系统会提示你输入安全密码短语，但你可以将其留空。
向虚拟机添加 SSH 密钥
在上一步中，我们生成了 SSH 密钥对。我们将获取公钥并将其粘贴到虚拟机设置中，具体方法是复制 id_ed25519.pub 的内容。你还需要允许虚拟机接受入站 SSH 流量。
使用 Azure 虚拟机的一个很酷的功能是能够启用自动关机（因为面对现实吧，我们都会忘记关闭虚拟机……）。如果你转到管理选项卡，可以设置每天关闭虚拟机的时间。
选择审阅并创建，Azure 将为你部署虚拟机！
使用 Remote - SSH 连接
既然我们已经介绍了如何创建 SSH 主机，那就让我们连接到它吧！
VS Code Remote - SSH 扩展允许你在 VS Code 内部使用 SSH 连接到远程计算机或虚拟机。如果你还没有安装 Remote - SSH 扩展，可以在扩展视图 (Ctrl + Shift + X) 中搜索 “remote ssh”。
你会注意到状态栏左下角有一个指示器。此指示器告诉你 VS Code 运行在哪个上下文中（本地或远程）。单击指示器以调出远程扩展命令列表。
选择 Remote-SSH: Connect to Host 命令，并通过按以下格式输入虚拟机的连接信息来连接到主机：user@hostname。
user 是你在向虚拟机添加 SSH 公钥时设置的用户名。对于 hostname，返回 Azure 门户，在我们创建的虚拟机的概述窗格中，复制公共 IP 地址。
在连接信息文本框中设置用户名和主机名。
VS Code 现在将打开一个新窗口（实例）。然后你会看到一条通知，提示“VS Code Server”正在 SSH 主机上进行初始化。一旦 VS Code Server 安装在远程主机上，它就可以运行扩展并与你的本地 VS Code 实例通信。
通过查看状态栏中的指示器，你将知道已连接到虚拟机。现在它显示了我们虚拟机的主机名！
Remote - SSH 扩展还在活动栏上增加了一个新图标，单击它将打开 SSH 资源管理器。在这里你可以配置 SSH 连接。例如，你可以保存最常连接的主机，并从这里访问它们，而无需再次输入用户名和主机名。
连接到 SSH 主机后，你可以与远程计算机上的文件交互并打开文件夹。如果你打开集成终端，你会看到你正在 bash shell 中工作，尽管你是在 Windows 上。等等，我们已经连接到虚拟机了？那太简单了。这就是重点。这些扩展让远程开发感觉简单、流畅，并且……嗯，一点也不像远程。😃
你可以使用 bash shell 浏览虚拟机上的文件系统。使用 mkdir demo 创建一个新文件夹 “demo”，然后你可以通过文件 > 打开文件夹浏览并打开远程主目录上的文件夹。
你还可以在远程 SSH 主机上专门安装扩展。影响 UI 的扩展（如主题和代码片段）安装在本地，其余扩展需要安装在远程 SSH 主机上。当你打开扩展视图时，会注意到有两个部分，一个是本地计算机上的扩展，另一个是远程主机上的扩展。即使你从不同的客户端通过 SSH 进入远程机器，你的远程扩展和设置也将保持不变。当你去安装扩展时，VS Code 会自动将其安装在正确的上下文中。
Hello World
让我们向虚拟机部署一个基本的 “Hello World” Python 应用。我们将使用一个名为 Flask 的流行 Python Web 框架。在 bash shell 中，运行以下命令。
sudo apt install python3-flask
在之前创建的 “Demo” 文件夹中，创建一个名为 app.py 的新文件 (Ctrl + N)，其中包含一个基础的 Hello world Flask 应用程序。
from flask import Flask
app = Flask(__name__)
@app.route("/")
def hello():
return "Hello Remote World! :)"
if __name__ == "__main__":
app.run()
一旦 VS Code 将文件语言识别为 Python，如果远程计算机上尚未安装 Microsoft Python 扩展，你会看到一条推荐该扩展的通知。
选择安装，重新加载 VS Code，你就会在远程计算机上看到 VS Code 的 IntelliSense 和代码着色。
要运行该应用，请按 F5，并选择 Flask 调试配置。在 Python 调试控制台中，你会看到应用正在 localhost 的 5000 端口运行。然而，这里的 localhost 目前是指远程服务器，而不是你的本地计算机。为了能在本地计算机上浏览该 Web 应用，我们将利用另一个名为端口转发的功能。
为了能够访问远程计算机上可能未公开暴露的端口，我们需要在本地计算机的端口与服务器之间建立连接或隧道。在应用仍在运行的情况下，打开 SSH 资源管理器并找到转发端口视图。单击转发端口链接，并指明我们要转发 5000 端口。
将连接命名为 “browser”。
服务器现在会将 5000 端口上的流量转发到本地计算机。当你浏览 https://:5000 时，你会看到正在运行的 Web 应用。
现在，真正的问题是……我们能在远程计算机上的 VS Code 中进行调试吗？是的！在应用仍在运行的情况下，在返回字符串 “Hello Remote World” 的那行设置断点，并在调试控制栏中点击重启按钮。刷新浏览器中的页面，你就会触发断点！你获得了相同的 VS Code 体验，包括编辑、调试以及所有的设置和扩展。😊
要切换回本地计算机进行本地开发，请通过文件 > 关闭远程连接来关闭远程连接。
使用 Remote - SSH 扩展，你可以针对虚拟机进行工作，并在远程计算机上使用 VS Code 的所有生产力功能和扩展。无论你的代码托管在何处，你都能获得你熟悉并喜爱的 VS Code 全方位开发体验。
如果你想了解有关 VS Code 远程开发的更多信息，可以阅读我们宣布远程开发的博客文章。你还可以尝试其他远程扩展：Dev Containers 和 WSL，并阅读我们完整的远程开发文档。
远程编码愉快！
Sana Ajani，VS Code 项目经理 @sana_ajani