Welcome 🎉

logo

ReactLMS

Search
Light Mode
Contact Us

3 min to read

Contact us

No results for your search.
Sorry, an unexpected error occurred

Giới thiệu


Đây là kỹ thuật cho phép bạn cache lại các nội dung trên máy của người dùng một cách hiệu quả, từ đó tăng tốc hiệu năng của ứng dụng.

⚠️
Khuyến khích sử dụng khi cần cache một thông tin nào đó trong một khoảng thời gian dài


Cách triển khai


Hãy tham khảo ví dụ sau

worker_processes auto;

events {
  worker_connections 1024;
}

http {
  include /env/nginx/mime.types;

  server {
    listen 80;
    server_name nglearns.test;

    root /srv/nglearns/static-demo;
    
    location ~* \.(css|js|jpg)$ {
      access_log off;
      add_header Cache-Control public;
      add_header Pragma public;
      add_header Vary Accept-Encoding;
      expires 1M;
    }
  }
}






trong ví dụ trên, bằng cách sử dụng location ~* .(css|js|jpg)$ bạn có thể nói cho nginx hiểu rằng chúng ta đang đề cập tới các file có đuôi là css, js và jpg.

Tiếp theo, ta sẽ sử dụng directive add_header để với các đuôi phù hợp, ta sẽ luôn add header, trong trường hợp này là Cache-Control public để nói với client rằng, các nội dung này sẽ được cache lại trong mọi trường hợp.

Ngoài ra, chúng ta có thể sử dụng Pragma, nó là phiên bản cũ như Cache-Control và cũng thực hiện ít nhiều tính năng tương tự như Cache-Control

Còn về header Vary, nó sẽ báo cho client biết việc cache nội dung có thể sẽ khác nhau, và việc thiết lập Accept-Encoding có nghĩa rằng nội dung tuỳ thuộc vào encoding thì sẽ được chấp nhận từ phía client.

Và cuối cùng là directive expires, thuộc tích này cho phép client hiểu rẳng thông tin này sẽ được cache trong bao lâu:

Để thực nghiệm, chúng ta sẽ chạy câu lệnh sau

curl -I http://nglearns.test/demo.jpg






Kết quả

# HTTP/1.1 200 OK
# Server: nginx/1.18.0 (Ubuntu)
# Date: Sun, 25 Apr 2021 15:58:22 GMT
# Content-Type: image/jpeg
# Content-Length: 19209
# Last-Modified: Sun, 25 Apr 2021 08:35:33 GMT
# Connection: keep-alive
# ETag: "608529d5-4b09"
# Expires: Tue, 25 May 2021 15:58:22 GMT
# Cache-Control: max-age=2592000
# Cache-Control: public
# Pragma: public
# Vary: Accept-Encoding
# Accept-Ranges: bytes






Tại đây ta có thể thấy được header đã được thêm các thuộc tính mà ta đã thiết lập sẵn.


Read More
On This Page