Phản hồi máy chủ 103 Early Hints

HTTP статус-код 103 (Early Hints)

HTTP статус-код 103 (Early Hints) là một mã trạng thái mới cho phép các máy chủ gửi các gợi ý trước cho khách hàng về các tài nguyên có thể cần thiết để xử lý yêu cầu. Điều này có thể giúp tăng tốc độ tải trang, vì các trình duyệt có thể bắt đầu tải các tài nguyên trước khi máy chủ hoàn tất xử lý yêu cầu chính.

Định nghĩa và cách hoạt động của mã trạng thái 103

Mã trạng thái 103 được thiết kế với mục tiêu chính là cải thiện hiệu suất tải trang bằng cách cung cấp thông tin trước cho trình duyệt. Khi một máy chủ gửi mã trạng thái 103, nó cho phép trình duyệt biết rằng có một số tài nguyên cần thiết sắp tới, từ đó giúp giảm thời gian chờ đợi.

Giúp giảm độ trễ trong việc tải tài nguyên.
Cung cấp thông tin về các tài nguyên có thể được tải trước.
Cải thiện trải nghiệm người dùng thông qua tốc độ tải trang nhanh hơn.

Áp dụng mã trạng thái 103 trong thực tế

Cách sử dụng mã trạng thái 103 để tối ưu hóa tải trang

Ví dụ: Tải trước phông chữ và phong cách: Khi máy chủ gửi mã trạng thái 103, nó có thể chỉ định các phông chữ và tệp CSS cần thiết, cho phép trình duyệt tải chúng ngay lập tức.
Ví dụ: Ghi chú các tài nguyên có thể được lưu vào bộ nhớ đệm: Máy chủ có thể thông báo cho trình duyệt về các tài nguyên có thể được lưu trữ để sử dụng trong các lần truy cập sau.

Với trình duyệt và khách hàng

Các trình duyệt hiện đại hỗ trợ mã trạng thái 103 và có thể xử lý chúng một cách hiệu quả, giúp tối ưu hóa quy trình tải trang. Dưới đây là bảng tóm tắt về sự hỗ trợ mã trạng thái 103 trong các trình duyệt khác nhau:

Trình duyệt	Hỗ trợ mã trạng thái 103
Chrome	Có
Firefox	Có
Safari	Có
Edge	Có

Ví dụ sử dụng

Ví dụ thực hiện trên máy chủ với Node.js


const http = require('http');

const server = http.createServer((req, res) => {
    res.writeHead(103, {
        'Link': '; rel=preload; as=style',
        'Link': '; rel=preload; as=font'
    });
    res.writeHead(200, { 'Content-Type': 'text/' });
    res.end('<>Hello World');
});

server.listen(3000);

Trong ví dụ này, máy chủ gửi mã 103 với các liên kết tới tệp CSS và phông chữ, cho phép trình duyệt tải chúng ngay lập tức.

Ví dụ thực hiện trên máy chủ với Python (Flask)


from flask import Flask, make_response

app = Flask(__name__)

@app.route('/')
def index():
    response = make_response('<>Hello World')
    response.headers['Link'] = '; rel=preload; as=style'
    response.headers['Early-Hints'] = '103'
    return response

if __name__ == '__main__':
    app.run()

Trong mã trên, Flask gửi tiêu đề "Link" với mã trạng thái 103 để thông báo cho trình duyệt tải trước tệp CSS.

Ví dụ thực hiện trên máy chủ với PHP


header("HTTP/1.1 103 Early Hints");
header("Link: ; rel=preload; as=style");
header("HTTP/1.1 200 OK");
?>
<>

    

Hello World

Ví dụ này cho thấy cách gửi mã trạng thái 103 và sau đó gửi mã trạng thái 200 với nội dung .

Các vấn đề tiềm ẩn và cách giải quyết

Cách xử lý các lỗi liên quan đến việc sử dụng mã trạng thái 103

Lỗi: Khách hàng không hỗ trợ mã trạng thái 103: Trong trường hợp này, máy chủ có thể tiếp tục xử lý yêu cầu mà không gửi mã trạng thái 103.
Giải pháp: Kế hoạch dự phòng cho các trình duyệt cũ: Cần đảm bảo rằng nội dung vẫn có thể tải được ngay cả khi mã trạng thái 103 không được hỗ trợ.

Cách tránh việc sử dụng sai mã trạng thái 103

Các lỗi thường gặp bao gồm:

Gửi mã trạng thái 103 mà không có tài nguyên đi kèm.
Không đảm bảo rằng tài nguyên được chỉ định sẽ có sẵn.

Cần kiểm tra tính khả dụng của tài nguyên trước khi gửi mã trạng thái 103.

Cách cấu hình máy chủ để hỗ trợ mã trạng thái 103

Cấu hình các máy chủ web (Nginx, Apache)

Để hỗ trợ mã trạng thái 103 trên Nginx, bạn có thể sử dụng các chỉ thị đặc biệt trong tệp cấu hình:


location / {
    add_header Link "; rel=preload; as=style";
}

Đối với Apache, bạn có thể thêm mã vào tệp .htaccess:


Header add Link "; rel=preload; as=style"

Khuyến nghị cấu hình

Đảm bảo rằng các tài nguyên được chỉ định là có sẵn.
Kiểm tra tính tương thích của trình duyệt trước khi triển khai mã trạng thái 103.