Fix net::ERR_HTTP2_PROTOCOL_ERROR - Khắc phục lỗi tải tài nguyên trên trình duyệt

intermediate🌐 Networking2026-06-03| Linux (Ubuntu/CentOS), Nginx 1.9.5+, Google Chrome, Microsoft Edge

Error Message

net::ERR_HTTP2_PROTOCOL_ERROR
#http2#mạng#trình duyệt#nginx

Tình Huống: Khi Tài Nguyên Đột Nhiên Không Tải Được

Bạn đang xây dựng một ứng dụng web hoặc đang tải một trang thì có nhiều tài nguyên—file CSS, JavaScript bundle, hình ảnh—đột nhiên từ chối tải. Console dành cho nhà phát triển của trình duyệt hiển thị thông báo kiểu này:

GET https://example.com/assets/main.js net::ERR_HTTP2_PROTOCOL_ERROR

Lỗi này khó chịu hơn cả lỗi 404. Lỗi 404 có nghĩa là file không tồn tại. Còn lỗi này có nghĩa là trình duyệt và server đã bắt đầu giao tiếp qua HTTP/2, rồi có gì đó sai sót giữa chừng. Chính kênh giao tiếp bị vỡ. Sự mơ hồ đó là thứ khiến việc debug trở nên khó khăn.

Tại Sao Điều Này Xảy Ra?

Lỗi này là một thông báo chung cho nhiều nguyên nhân gốc rễ khác nhau. Trong thực tế, nó quy về bốn thủ phạm chính:

  • Giới Hạn Kích Thước Header: Cookie được đóng gói vào request header. Nếu ứng dụng của bạn lưu trữ hơn 8 KB dữ liệu trong cookie, HTTP/2 header có thể vượt quá kích thước buffer cho phép của Nginx.
  • Proxy Buffering của Nginx: Khi Nginx proxy một backend, nó sẽ buffer response. Buffer mặc định (thường là 4 × 8 KB) quá nhỏ cho các response API lớn, khiến stream bị kết thúc sớm.
  • Dung Lượng Đĩa: Nginx ghi phần tràn vào thư mục proxy_temp. Đĩa đầy sẽ làm hỏng quá trình ghi đó, và HTTP/2 stream sẽ bị crash theo.
  • Phần Mềm Lỗi Thời: Các phiên bản Nginx trước 1.14 có lỗi thực sự trong HTTP/2 stack. Nếu bạn vẫn đang dùng một trong số đó, hãy nâng cấp trước—trước khi chỉnh sửa bất kỳ cấu hình nào.

Bước 1: Sửa Nhanh (Phía Client)

Bắt đầu từ đây trước khi chỉnh sửa cấu hình server. Trạng thái trình duyệt gây ra lỗi này thường xuyên hơn bạn nghĩ.

Xóa Cache và Cookie Của Trình Duyệt

Cookie bị phình to là nguyên nhân điển hình. Mở trang web trong cửa sổ Ẩn danh hoặc Riêng tư. Nếu trang tải được ở đó, thì cookie của bạn là vấn đề—hãy xóa dữ liệu trang web và thử lại.

Kiểm Tra Tiện Ích Mở Rộng Trình Duyệt

Các tiện ích chặn quảng cáo, tiện ích VPN và các công cụ bảo mật đều có thể can thiệp vào HTTP/2 stream. Vô hiệu hóa chúng từng cái một, rồi tải lại trang. Chỉ mất 30 giây và loại trừ được cả một nhóm nguyên nhân.

Bước 2: Sửa Phía Server (Cấu Hình Nginx)

Đối với hầu hết các môi trường production, cấu hình Nginx là nơi chứa giải pháp thực sự. Bắt đầu với header buffer, rồi chuyển sang proxy buffer nếu cần.

Tăng Kích Thước Header Buffer

Thêm các chỉ thị này vào block http, server, hoặc location của bạn. File cấu hình thường nằm tại /etc/nginx/nginx.conf hoặc /etc/nginx/sites-available/default:

http {
    # ... cấu hình hiện tại ...

    # Tăng kích thước cho phép của HTTP/2 header
    http2_max_field_size 16k;
    http2_max_header_size 32k;

    # Đồng thời tăng header buffer chung
    large_client_header_buffers 4 32k;
}

Lưu ý cho Nginx 1.25.5+: Các chỉ thị http2_max_field_sizehttp2_max_header_size đã bị xóa khi module HTTP/2 được viết lại trong phiên bản đó. Với các phiên bản đó, large_client_header_buffers là tùy chọn duy nhất bạn cần.

Điều Chỉnh Cài Đặt Proxy Buffer

Đang proxy một backend như Node.js hay Python? Buffer mặc định rất nhỏ—chỉ 4 × 8 KB. Một response API đơn lẻ trả về payload JSON 500 KB sẽ vượt qua đó ngay lập tức. Khi buffer đầy, Nginx ngắt HTTP/2 stream.

location / {
    proxy_buffer_size 128k;
    proxy_buffers 4 256k;
    proxy_busy_buffers_size 256k;
    proxy_pass http://your_backend;
}

Bước 3: Kiểm Tra Môi Trường

Các bản sửa cấu hình sẽ không có tác dụng nếu vấn đề là môi trường. Hai thứ cần kiểm tra: dung lượng đĩa và phiên bản Nginx.

Kiểm Tra Dung Lượng Đĩa

Nginx ghi các response lớn vào thư mục tạm dưới /var/lib/nginx. Phân vùng đầy có nghĩa là việc ghi thất bại, và HTTP/2 stream bị crash ngay lập tức. Kiểm tra bằng:

df -h

Bất kỳ phân vùng nào ở mức 100% đều là dấu hiệu cảnh báo ngay lập tức. Một server hoạt động nhiều có thể tích lũy hàng gigabyte access log trong /var/log/nginx/ chỉ trong một tuần—hãy rotate hoặc xóa chúng để giải phóng dung lượng nhanh.

Kiểm Tra Phiên Bản Nginx

Các bản triển khai HTTP/2 đầu tiên có lỗi ổn định thực sự. Bất kỳ phiên bản nào trước 1.14 đều đáng nâng cấp bất kể lỗi này. Kiểm tra phiên bản đang chạy:

nginx -v

Tính đến năm 2024, Nginx 1.26.x là nhánh ổn định hiện tại. Nếu bạn đang dùng phiên bản cũ hơn hai phiên bản chính, chỉ việc nâng cấp thôi cũng có thể giải quyết được vấn đề.

Bước 4: Xác Minh

Đừng bao giờ khởi động lại Nginx mà không kiểm tra cấu hình trước. Một lỗi cú pháp sẽ làm sập server.

sudo nginx -t

Kết quả thành công trông như thế này: nginx: configuration file /etc/nginx/nginx.conf test is successful. Sau đó reload service:

sudo systemctl reload nginx

Xác nhận bản sửa từ dòng lệnh bằng curl với cờ --http2:

curl -I --http2 https://example.com/assets/main.js

Bạn muốn thấy HTTP/2 200 trong response. Bất kỳ kết quả nào khác có nghĩa là stream vẫn đang thất bại ở đâu đó.

Mẹo Về Mạng và Phòng Ngừa

Lỗi giao thức đôi khi bắt nguồn từ tầng mạng, không phải ứng dụng. Ví dụ, sự không khớp MTU có thể phân mảnh HTTP/2 frame theo cách trông giống hệt như một vấn đề Nginx buffer. Nếu bạn đã điều chỉnh tất cả các cài đặt Nginx mà lỗi vẫn còn, hãy kiểm tra xem lỗi có tái hiện trên kết nối trực tiếp không—bỏ qua bất kỳ lớp VPN, load balancer hay CDN nào.

Trong các thiết lập VPC nơi lưu lượng đi qua nhiều bước nhảy, các subnet tính toán sai có thể tạo ra chi phí định tuyến biểu hiện thành lỗi ở tầng giao thức. Một Subnet Calculator rất tiện dụng để xác minh các dải CIDR của bạn là chính xác trước khi bạn tốn thêm một tiếng nữa để tinh chỉnh Nginx buffer.

Tóm lại: giữ cookie dưới 4 KB, đặt kích thước proxy buffer phù hợp với kích thước response thực tế, và cập nhật Nginx thường xuyên. Làm được ba điều đó và bạn sẽ hiếm khi gặp lại lỗi này.

Related Error Notes