Sử dụng file .http trong Visual Studio 2022

Hướng dẫn sử dụng file .http và .rest tích hợp sẵn trong Visual Studio 2022 (v17.8+) để gửi yêu cầu HTTP, kiểm thử REST API với biến môi trường không cần Postman.

Từ phiên bản Visual Studio 2022 v17.8, Microsoft đã tích hợp sẵn trình soạn thảo và thực thi file .http (hoặc .rest). Đây là công cụ cực kỳ mạnh mẽ giúp lập trình viên kiểm thử API ngay trong IDE mà không cần cài đặt thêm các công cụ bên ngoài như Postman hay Insomnia.

Yêu cầu: Visual Studio 2022 v17.8 trở lên với workload ASP.NET and web development đã cài đặt.

Tính năng nổi bật

• Built-in: Hỗ trợ sẵn, không cần extension.

• Tích hợp sâu: Cho phép lấy thông tin từ biến môi trường của dự án (Launch Profiles).

• Git-friendly: File văn bản thuần túy, dễ dàng lưu trữ và chia sẻ cùng mã nguồn.

• Hỗ trợ biến (Variables): Định nghĩa biến để tái sử dụng cho nhiều môi trường.

Cách sử dụng cơ bản

1. Tạo file

Bạn có thể tạo file mới bằng cách:

1. Chuột phải vào Project -> Add -> New Item.

2. Tìm kiếm http hoặc chọn Code -> HTTP File.

3. Đặt tên file có đuôi .http hoặc .rest.

2. Viết yêu cầu HTTP

Cấu trúc cơ bản gồm phương thức (Method), URL và các Header.

example.http

@baseUrl = https://localhost:7001

### Lấy danh sách sản phẩm
GET {{baseUrl}}/api/products
Accept: application/json

### Thêm sản phẩm mới
POST {{baseUrl}}/api/products
Content-Type: application/json

{
  "name": "IPhone 15",
  "price": 999
}

3. Thực thi và xem kết quả

• Gửi yêu cầu: Nhấn vào biểu tượng nút Play (hoặc chữ Send Request) xuất hiện ngay phía trên dòng định nghĩa phương thức HTTP.

• Xem kết quả: Kết quả sẽ hiển thị ở một cửa sổ bên phải (HTTP Response) bao gồm: Status Code, Response Headers, và Body (hỗ trợ format JSON/XML).

Kỹ thuật nâng cao

Sử dụng biến môi trường (Environment Variables)

Visual Studio 2022 hỗ trợ file http-client.env.json để quản lý biến theo từng môi trường (Development, Staging, Production).

http-client.env.json

{
  "dev": {
    "host": "localhost:7001",
    "token": "dev-token"
  },
  "prod": {
    "host": "api.nqdev.com",
    "token": "prod-token"
  }
}

Sau đó trong file .http, bạn có thể chọn môi trường ở thanh công cụ phía trên và sử dụng:

GET https://{{host}}/api/user
Authorization: Bearer {{token}}

Phân tách các yêu cầu

Sử dụng dấu ### để phân tách giữa các Request trong cùng một file. Visual Studio sẽ coi mỗi phần là một yêu cầu độc lập để bạn có thể nhấn "Send" riêng lẻ.

Biến môi trường chung ($shared)

$shared là tên environment đặc biệt, giá trị trong $shared sẽ được dùng làm mặc định cho tất cả các environment khác nếu environment đó không định nghĩa lại biến.

http-client.env.json

{
  "$shared": {
    "HostAddress": "https://localhost:7293"
  },
  "dev1": {
    "username": "dev1user"
  },
  "dev2": {
    "username": "dev2user"
  },
  "staging": {
    "username": "staginguser",
    "HostAddress": "https://staging.contoso.com"
  }
}

Trong ví dụ trên:

• dev1 và dev2 không định nghĩa HostAddress → lấy giá trị từ $shared (https://localhost:7293).

• staging định nghĩa HostAddress riêng → ghi đè giá trị từ $shared.

Request Variables (Biến từ response)

Bạn có thể truyền giá trị từ response của request này sang request khác trong cùng file .http bằng cách đặt comment # @name ngay trước request cần đặt tên:

example.http

# @name login
POST https://localhost:44320/api/login
Content-Type: application/json

{
  "username": "admin",
  "password": "123456"
}

###

GET https://localhost:44320/api/userinfo
Authorization: Bearer {{login.response.body.$.token}}

###

Syntax trích xuất giá trị:

{{<request name>.(response|request).(body|headers).(*|JSONPath|XPath|<header name>)}}.

Ví dụ:

• {{login.response.body.*}} — lấy toàn bộ body.

• {{login.response.body.$.token}} — lấy trường token từ JSON (JSONPath).

• {{login.response.headers.Location}} — lấy header Location.

Tip: Bạn cần trigger request có @name trước (nhấn Send) để có response, sau đó mới dùng được biến từ response của nó.

Thực hành

Bước 1: Tải source code mẫu

Bạn có thể tải source code mẫu tại đây, hoặc bạn có thể thực hành ngay trên source code của chính bạn.

Bước 2: Tạo thư mục Http Files

Tạo thư mục Http Files trong project để quản lý các file .http.

Solution
 └── Project
      ├── Controllers
      │    └── SampleController.cs
      ├── Http Files
      │    ├── sample.http
      │    └── http-client.env.json
      └── Program.cs

Bước 3: Tạo file sample.http

Trong project có một Controller là SampleController, nên chúng ta sẽ tạo file sample.http để quản lý các request trong Controller đó.

Bước 4: Tạo file biến môi trường

Tạo file http-client.env.json, đặt trong thư mục Http Files:

Http Files/http-client.env.json

{
  "dev": {
    "HostAddress": "https://localhost:7229/api"
  },
  "test": {
    "HostAddress": "https://testapp.com"
  }
}

Bước 5: Viết test API

Trong file sample.http, viết request test API lưu dữ liệu:

Http Files/sample.http

@controllerName=sample

POST {{HostAddress}}/{{controllerName}}
Content-Type: application/json

{
    "GroupName": "Gia đình",
    "Description": "Bao gồm từ vựng chủ đề gia đình",
    "GroupTypeEnum": 1
}

###

Trong đó:

• @controllerName — biến được khai báo riêng trong file .http.

• {{HostAddress}} — biến môi trường khai báo trong file http-client.env.json.

Bước 6: Chạy và kiểm tra kết quả

1. Chạy project (F5 hoặc Ctrl+F5).

2. Chọn Send Request ở trên mỗi API cần test.

3. Sau khi gửi, màn hình sẽ hiển thị kết quả request lỗi hay thành công.

Tip: Để xem toàn bộ thông tin Request được gửi đi, bạn chọn Tab Request trong cửa sổ kết quả.

Endpoints Explorer

Endpoints Explorer là tool window hiển thị tất cả các endpoint mà Web API định nghĩa, cho phép bạn tạo request .http tự động.

Cách sử dụng:

1. Mở View > Other Windows > Endpoints Explorer.

2. Chuột phải vào endpoint cần test > Generate Request.

3. Visual Studio tự động tạo file .http (hoặc thêm vào file có sẵn) với request tương ứng.

Tip: Từ Visual Studio 17.11 Preview, Endpoints Explorer còn discovery endpoint tại runtime (chỉ statically trước đó).

Các tính năng chưa hỗ trợ

Visual Studio 2022 .http editor chưa hỗ trợ một số tính năng có trong VS Code REST Client extension:

• Request spans nhiều dòng

• Chỉ định file path làm request body

• Multipart/form-data với mixed format

• GraphQL requests

• cURL request / Copy/paste as cURL

• Request history

• Lưu response body ra file

• Certificate-based authentication

• Prompt variables

Lưu ý quan trọng

Tip: Bạn có thể kéo thả tệp kết quả Response ra cửa sổ riêng hoặc lưu lại để so sánh sau này.

Bảo mật: Tránh commit file http-client.env.json nếu nó chứa thông tin nhạy cảm như API Key hoặc mật khẩu. Hãy đưa nó vào .gitignore và sử dụng tệp http-client.env.json.user cho các giá trị bí mật cá nhân.

Tài liệu tham khảo

• Microsoft Learn: Use .http files in VS 2022

• LinkedIn: Using .http files in Visual Studio 2022

• Viblo: HTTP file gọi REST API ngay trong Visual Studio

---

Nếu thấy nội dung này bổ ích... https://me.momo.vn/nhquydev