Website được thiết kế tối ưu cho thành viên chính thức. Hãy Đăng nhập hoặc Đăng ký để truy cập đầy đủ nội dung và chức năng. Nội dung bạn cần không thấy trên website, có thể do bạn chưa đăng nhập. Nếu là thành viên của website, bạn cũng có thể yêu cầu trong nhóm Zalo "CNTT" các nội dung bạn quan tâm.

Bài 14. Reverse Proxy cho Web App (Drupal, API, Dashboard)

ICT

1. Đặc thù của Web App trong hệ thống của mình

Web App (Drupal, API, Dashboard, hệ thống điều hành) khác căn bản so với website thông thường:

  • Request không chỉ đọc, mà còn:

    • ghi dữ liệu,

    • upload file,

    • xử lý báo cáo dài,

    • gọi API liên tục.

  • Session, cookie, authentication phức tạp.

  • Có thể dùng:

    • REST API,

    • AJAX,

    • WebSocket,

    • background job.

Vì vậy, Reverse Proxy cho Web App không thể dùng cấu hình của website thường.
Nếu không chuẩn hóa, các lỗi sau sẽ xuất hiện sớm hay muộn:

  • 504 Gateway Timeout

  • Upload bị ngắt giữa chừng

  • API trả lỗi không ổn định

  • Dashboard treo khi có nhiều người dùng


2. Vai trò của Reverse Proxy với Web App

Trong mô hình của mình:

Client → (Cloudflare) → Reverse Proxy → Web App backend (QMS / AI)

Reverse Proxy phải đảm nhiệm:

  1. Terminate HTTPS

  2. Chuẩn hóa headers

  3. Quản lý timeout và upload

  4. Cách ly backend khỏi Internet

  5. Hỗ trợ failover QMS ↔ AI


3. Kiến trúc chuẩn cho Web App phía sau Reverse Proxy

3.1. Nguyên tắc chung

  • Backend chỉ lắng nghe HTTP nội bộ

  • Không expose port backend ra Internet

  • Không xử lý HTTPS tại backend

  • Reverse Proxy là điểm kiểm soát duy nhất

3.2. Lợi ích

  • Giảm tải cho backend

  • Dễ debug

  • Failover nhanh

  • Ít điểm lỗi hơn


4. Chuẩn hóa cấu hình Reverse Proxy cho Web App

4.1. Snippet bắt buộc cho Web App

Một Web App bắt buộc phải include:

  • proxy-common.conf

  • proxy-webapp.conf

  • backend-active.conf

Nếu thiếu một trong các snippet này, khả năng cao sẽ phát sinh lỗi khi vận hành thực tế.


4.2. Template HTTPS cho Web App (chuẩn)

server {
   listen 443 ssl http2;
   server_name app.example.com;

   ssl_certificate     /etc/letsencrypt/live/app.example.com/fullchain.pem;
   ssl_certificate_key /etc/letsencrypt/live/app.example.com/privkey.pem;

   include snippets/ssl/ssl-common.conf;
   include snippets/ssl/ssl-params.conf;

   include snippets/headers/security-headers.conf;

   include snippets/proxy/proxy-common.conf;
   include snippets/proxy/proxy-webapp.conf;

   location / {
       include snippets/backend/backend-active.conf;
   }
}
 

5. Reverse Proxy cho Drupal (các điểm cần lưu ý)

Drupal là Web App điển hình trong hệ thống của mình.

5.1. Header bắt buộc để Drupal nhận đúng HTTPS

Trong proxy-common.conf cần có:

 
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

Nếu thiếu:

  • Drupal có thể sinh URL HTTP

  • Cookie secure hoạt động sai


5.2. Upload file lớn (media, report)

  • Drupal upload thường qua /sites/default/files

  • Cần client_max_body_size đủ lớn

Đã được xử lý trong:

include snippets/proxy/proxy-webapp.conf;

5.3. Timeout khi chạy cron, export, report

Drupal có:

  • batch API

  • export CSV

  • report dài

Nếu dùng timeout mặc định → dễ lỗi 504.

Giải pháp:

  • Timeout đã được tăng trong proxy-webapp.conf

  • Không đặt timeout riêng từng site (trừ khi đặc thù)


6. Reverse Proxy cho API (REST / JSON)

6.1. Đặc thù API

  • Nhiều request nhỏ

  • Có thể trả JSON lớn

  • Cần độ ổn định cao hơn tốc độ tối đa

6.2. Cấu hình proxy phù hợp cho API

  • Không cần gzip quá nặng

  • Cần buffer hợp lý

  • Timeout không quá ngắn

Dùng chung template Web App là đủ cho đa số API nội bộ.


7. Reverse Proxy cho Dashboard (AJAX / realtime nhẹ)

Dashboard thường:

  • Polling liên tục

  • AJAX nhiều

  • Có thể kết hợp WebSocket

7.1. Nếu Dashboard không dùng WebSocket

  • Template Web App là đủ.

7.2. Nếu Dashboard có WebSocket

  • Bắt buộc thêm:

 
include snippets/proxy/proxy-websocket.conf;

Ví dụ:

location / {
   include snippets/backend/backend-active.conf;
   include snippets/proxy/proxy-websocket.conf;
}
 

8. Tách Web App khỏi Website thường (bắt buộc)

Một sai lầm phổ biến:

  • Đặt Web App và Website CMS chung một domain

  • Dùng chung cấu hình proxy

Khuyến nghị:

  • Website: www.example.com

  • Web App: app.example.com

Lợi ích:

  • Cấu hình đơn giản

  • Bảo mật tốt hơn

  • Không ảnh hưởng lẫn nhau khi có sự cố


9. Logging và debug Web App

9.1. Khi có lỗi từ Web App

Trên Reverse Proxy:

 
tail -f /var/log/nginx/error.log

Kiểm tra:

  • timeout

  • upstream error

  • connection reset

9.2. Phân biệt lỗi Proxy vs Backend

  • Proxy lỗi → log có upstream

  • Backend lỗi → proxy vẫn trả response nhưng status 5xx


10. Checklist triển khai Web App mới

  1. Xác định là Web App (không phải website thường).

  2. Tạo file trong sites-available/webapp/.

  3. Dùng template Web App chuẩn.

  4. Include backend-active.

  5. Kiểm tra upload & timeout.

  6. Test failover QMS ↔ AI.


Kết luận

Reverse Proxy cho Web App cần:

  • Cấu hình khác website thường.

  • Chuẩn hóa snippet và template.

  • Luôn đặt trong tư duy vận hành lâu dài.

Với cách làm này:

  • Drupal chạy ổn định,

  • API ít lỗi ngẫu nhiên,

  • Dashboard không treo khi nhiều người dùng,

  • Failover QMS ↔ AI diễn ra trơn tru.