VSCode内置HTTP客户端支持在编辑器内发送HTTP请求并查看响应。需创建.http文件,编写GET/POST等请求,添加请求头与变量,用Cmd+Alt+R执行,响应结构化显示于新标签页。

如果您希望在不离开代码编辑器的情况下发送HTTP请求并查看响应,VSCode的内置HTTP客户端提供了一种轻量、集成度高的替代方案。以下是使用该功能的具体方式:
本文运行环境:MacBook Air,macOS Sequoia。
一、启用并配置HTTP文件支持
VSCode内置HTTP客户端依赖于以 .http 或 .rest 为扩展名的文件进行请求定义。系统默认已支持该功能,无需额外安装插件,但需确保文件关联正确且语法高亮启用。
1、在VSCode中新建一个空白文件。
2、点击右下角显示的文件类型(如“纯文本”),在弹出菜单中选择“Configure File Association for '.http'…”。
3、在输入框中键入 http 并按回车确认。
4、保存文件,扩展名为 example.http。
二、编写基础HTTP请求
HTTP客户端通过特定语法解析请求行、头字段和请求体,支持GET、POST、PUT、DELETE等多种方法,并能自动识别空行分隔符。
1、在 .http 文件中输入以下内容:
GET https://httpbin.org/get
2、将光标置于该请求行任意位置。
3、按下 Cmd+Alt+R(macOS)或 Ctrl+Alt+R(Windows/Linux)触发请求发送。
4、响应结果将在新标签页中以结构化格式展示,包含状态码、响应头与响应体。
三、添加请求头与认证信息
可在请求行下方添加多行键值对形式的HTTP头,用于模拟真实客户端行为,例如携带身份凭证或指定内容类型。
1、在 .http 文件中输入以下内容:
GET https://httpbin.org/headers
User-Agent: VSCode-HTTP-Client/1.0
2、确保请求行与首行请求头之间无空行,且各头字段独占一行。
3、再次执行请求,响应中的 headers 字段将包含上述自定义头信息。
四、发送带请求体的POST请求
对于需要提交数据的接口,可在请求头后插入空行,再添加原始JSON、表单或纯文本格式的请求体,客户端将自动设置 Content-Length 和 Content-Type。
1、输入如下内容:
POST https://httpbin.org/post
Content-Type: application/json
{
"name": "Alice",
"score": 95
}
2、光标置于 POST 行内,执行请求。
3、响应体中的 json 字段将准确映射您提交的结构化数据。
五、复用变量与环境配置
通过定义 @variables 块可避免硬编码敏感值或重复URL片段,提升脚本可维护性与安全性。
1、在文件顶部添加变量定义:
@host = https://httpbin.org
@token = abc123xyz
2、在后续请求中引用变量:
GET {{host}}/bearer
Authorization: Bearer {{token}}
3、变量名使用双大括号包裹,支持跨请求复用和局部覆盖。










