Web 版 VS Code - Azure
VS Code for the Web 是 Visual Studio Code 的零安装、基于浏览器的版本。/azure(简称)环境可通过 https://vscode.dev/azure 访问,它是专为 Azure 开发打造的空间,让您能够在几秒钟内运行、调试并将应用程序部署到 Azure。
该环境由 Azure Cloud Shell 提供支持,可提供长达 4 小时的计算时间,无需手动配置开发环境或安装依赖项。/azure 预装了最新的库、扩展和工具,让您可以立即开始编码。

入门
/azure 环境包含您开始开发和部署 Azure 应用程序所需的一切
预装扩展
Azure Developer CLI - 此扩展使运行、创建 Azure 资源以及使用 Azure Developer CLI 部署 Azure 应用程序变得更加容易。
支持的编程语言
所有主流运行时均已预装
- Python - 3.12.9
- Java - openjdk 17.0.16 2025-07-15 LTS
- OpenJDK 运行时环境 Microsoft-11926113 (build 17.0.16+8-LTS)
- OpenJDK 64 位服务器虚拟机 Microsoft-11926113 (build 17.0.16+8-LTS, 混合模式, 共享)
- Node.js - v20.14.0
- C# - 9.0.304
GitHub 仓库
使用 GitHub Repository 扩展无缝地将更改直接提交到您的 GitHub 仓库。GitHub Repositories 允许您直接在编辑器内远程浏览和编辑仓库,而无需将代码拉取到本地计算机。您可以在我们的 GitHub Repositories 指南中了解有关该扩展及其工作原理的更多信息。
继续在桌面版 VS Code 中工作
在 Azure Cloud Shell 容器时间用尽后,您可能希望继续在桌面版 VS Code 中工作。使用 VS Code for the Web 状态栏中的继续工作 (Continue Working on) 按钮,将您的代码提交到 GitHub 中的选定仓库,并切换到您的本地环境。
在此体验中,您有两种本地继续工作的选择
- 使用 Docker:启动一个预先配置好的开发容器。
- 使用本地 VS Code:克隆仓库并使用 README 文件配置您的环境。
Azure 入口点
/azure 体验集成了 Microsoft Foundry,旨在拉近代码与开发者的距离。在 VS Code for the Web 中打开 (Open in VS Code for the Web) 等按钮可直接在 Chat Playground、Agent Playground 和 Microsoft Foundry 主页等环境中找到。请参阅“示例用例或场景”部分了解更多信息。
开始使用
- 选择一个模型。
- 构建并测试您的代理。
- 选择查看代码 (View Code),然后选择您的编程语言和 SDK。
- 通过一键式的在 VS Code 中打开 (Open in VS Code for the Web) 按钮直接启动 VS Code。
或者,您也可以从 Microsoft Foundry 主页创建代理
- 打开 Microsoft Foundry 主页 (https://ai.azure.com)
- 查看在主页上生成的建议代码片段
- 选择在 VS Code 中打开 (Open in VS Code),通过一键式体验根据生成的代码创建代理
此外,开发者可以使用 AI 应用库 (AI App Gallery, https://aka.ms/aiapps) 中的模板入门,并选择在 VS Code 中打开 (Open in VS Code),以一步操作将其模板启动到 /azure 环境中。
开始使用
- 导航至 AI 应用库 (https://aka.ms/aiapps)
- 选择模板或搜索您想要运行的模板
- 从下拉菜单中选择在 VS Code 中打开 (Open in VS Code)
- 直接启动 VS Code 并使用 GitHub Copilot 回答您可能有的任何问题。
我们还集成了 Azure 门户。现在,当开发者使用 Azure Copilot 生成代码时,可以访问“在 VS Code 中打开”按钮。
开始使用
- 打开 Azure 门户并使用您的 Azure 帐户登录
- 导航到 Azure Copilot 并开始开发您想要构建的场景
- 一旦 Copilot 生成代码,选择生成的代码文件并选择在 VS Code 中打开 (Open in VS Code)
- 直接在 VS Code 中启动,并使用 GitHub Copilot 回答任何后续问题。
示例用例或场景
以下是 \azure 环境的常用场景。
-
- 访问 Microsoft Foundry NextGen 门户,并在为您代理生成的代码旁选择在 VS Code 中打开 (Open in VS Code)
- 等待 VS Code for the Web - Azure 环境初始化并设置您的环境
- 阅读 README 文件并按照步骤运行 create_and_run_agent.py 文件
- 您的代理已成功创建并运行!继续使用(预装的)Foundry 扩展来微调您的代理,或按照以下步骤使用您的代理创建应用程序
-
使用 Microsoft Foundry 创建模型部署并在 VS Code 中打开代码
-
在 Microsoft Foundry 门户中,为您的用例选择最佳模型,包括 Foundry 模型中的 o3、o4-mini 或 MAI-DS-R1。在本例中,我们将以 gpt-4o-mini 为例演示代理工作流。

-
从 gpt-4o-mini 模型卡片中配置模型终结点。

-
进入代理试验场 (agents playground),修改最大响应 (max responses) 和历史消息 (past messages) 等生成控件。添加知识、工具和操作。

-
迭代您的示例提示词 (prompt),并在代理试验场中继续试验。
-
完成后,选择查看代码 (View Code) 按钮,查看与代理在代理试验场中交互的上下文代码示例。

在这里,您可以看到 Python、C# 和 JavaScript 语言的多种代理代码示例;对于模型,还包含了 JSON、cURL、JavaScript、C# 和 Go 示例。Entra ID 可用于验证代理,且模型现已支持“密钥授权 (Key Authorization)”。

-
准备好后,选择在 VS Code 中打开 (Open in VS Code),并被重定向到 VS Code for the Web 的 /azure 环境。

您会注意到,随着环境的设置,代码示例、API 终结点和密钥会自动导入到新的 VS Code for the Web 工作区中。

在右下角,您会看到 API 密钥已在终端的环境变量中设置,并且示例代码已成功下载。

-
通过终端执行
python agent_run.py在本地运行模型。几秒钟内,您就会看到成功的模型响应。
-
azd命令可用于使用该代理配置和部署 Web 应用程序。azd init会初始化 git 仓库,创建一个默认的 Azure 工作区,在该工作区中代理可用于应用程序。
-
azd up通过创建相关的 Azure 资源来配置 Web 应用程序。完成后,选择终端中提供的链接,即可在浏览器中看到正在运行的应用程序
-
选择左下角的“在桌面上继续 (Continue on Desktop)”,在桌面版 VS Code 或 GitHub Desktop 中继续工作。此按钮允许您一键将工作区移动到本地环境。如果您有附加到现有应用程序的开发容器,您可以选择使用该容器或移动到本地环境。

-
-
上述快速入门适用于 vscode.dev/azure,因为 vscode.dev/azure 涵盖了所有先决条件
- 已安装 Python
- 已安装 Azure Functions Core Tools
- 您需要自行安装这些组件
- Azure Functions 扩展
-
使用 AI 工具包 (AI Toolkit) 构建和测试 AI 代理
主要功能
- 拥有丰富生成式 AI 模型源的模型目录(GitHub、ONNX、OpenAI、Anthropic、Google 等)
- 自带模型 (Bring Your Own Models):来自远程托管的模型,或本地运行的 Ollama 模型
- 用于模型推理或通过聊天进行测试的试验场
- 支持多模态语言模型的附件
- 针对选定 AI 模型的批量运行提示词
- 使用数据集评估 AI 模型,支持常见的评估指标,如 F1 分数、相关性、相似度、连贯性等
限制
尽管 VS Code for the Web 在功能上几乎与桌面版 VS Code 持平,但开发环境仍存在一些限制
- 除 Cloud Shell 外,没有终端访问权限
- 对某些原生扩展或语言功能的支持有限
- 不支持离线模式
故障排除
如果您在使用 VS Code for the Web – Azure 时遇到任何问题,请在我们的 GitHub 仓库中记录问题
连接问题
如果您无法连接到 https://vscode.dev/azure,通常可以通过重置 Azure Cloud Shell 来解决。这可以在 Azure 门户中完成。
使用右上角的按钮在 Azure 门户中打开 Cloud Shell。

接下来,在设置下拉菜单中,选择重置用户设置 (Reset User Settings)。

完成后,您应该会看到此屏幕。

收集日志
扩展日志将帮助我们诊断有关 vscode.dev/azure 的任何问题。您可以通过转到“输出 (Output)”视图,然后选择 VS Code for the Web - Azure 输出通道来访问它们。


相关资源
通过以下资源继续学习和探索
反馈与支持
在使用 vscode.dev/azure 时,若发现问题,请在我们的 GitHub 仓库中创建议题。细节越详尽越好。如果可能,请附上来自“VS Code for the Web - Azure”输出通道的日志。