Làm thế nào để cache toàn bộ dữ liệu website lên CloudFlare?
Theo mặc định, CloudFlare chỉ cache các file dữ liệu tĩnh (CSS, JS, hình ảnh…) trên hệ thống CDN của họ. Nó không cache HTML, do đó tác dụng cải thiện tốc độ load và khả năng chịu tải cho website của CloudFlare chưa phải ở mức cao nhất. Nếu bạn đang sử dụng CloudFlare thì ngay sau đây là hướng dẫn giúp cache toàn bộ dữ liệu website của mình lên CloudFlare. Tương tự như tính năng của các plugin tạo cache trên WordPress, CloudFlare sẽ cho phép bạn tạo một bản cache hoàn chỉnh cho website.
Tham khảo thêm:
Khi nào bạn nên cache toàn bộ dữ liệu website?
Nếu website của bạn có dữ liệu ít khi cập nhật và thay đổi, chỉ cho khách truy cập xem nội dung mà không tương tác (không bình luận, không đặt hàng…) thì cache toàn bộ dữ liệu website lên CloudFlare CDN là một sự lựa chọn tuyệt vời. Nó không chỉ giúp bạn giảm TTFB (website phản hồi truy vấn nhanh hơn) mà còn giúp bạn chống tấn công từ chối dịch vụ (DDoS) rất hiệu quả.
Nếu website của bạn có dữ liệu được thay đổi thường xuyên (cho phép độc giả bình luận tương tác, bán hàng online bằng WooCommerce…), bạn nên xem xét đăng ký “Tính năng Automatic Platform Optimization của CloudFlare” với giá chỉ $5/tháng.
Cache toàn bộ dữ liệu website lên CloudFlare
1. Đăng nhập vào tài khoản CloudFlare của bạn => lựa chọn tên miền tương ứng => click vào tab Caching => trong mục Browser Cache TTL, hãy lựa chọn thời gian hiệu lực của tính năng cache trình duyệt là Respect Existing Headers.
Chọn Respect Existing Headers sẽ yêu cầu CloudFlare không tự động ghi đè hoặc chèn giá trị vào cache-control Header, trừ khi nó được Page Rule (quy tắc trang) cụ thể yêu cầu phải làm như vậy.
Chúng ta sẽ thêm một số Page Rule trong bước tiếp theo và bước này sẽ đảm bảo rằng bất kỳ quy tắc trang nào cũng không ghi đè lên các quy tắc khác.
2. Chuyển qua tab Rules => Page Rules => click vào nút Create Page Rule.
3. Lần lượt tạo 3 Page Rule với các nội dung như sau:
- Dành cho
https://tenmiencuaban.com/*
- Dành cho
https://tenmiencuaban.com/wp-login*
- Dành cho
https://tenmiencuaban.com/wp-admin/*
Trong đó:
- Cache Level – Standard: chỉ cache các file tĩnh (CSS, JS, hình ảnh…) theo mặc định của CloudFlare.
- Cache Level – Cache Everything: cache tất cả dữ liệu của trang, bao gồm cả HTML.
- Browser Cache TTL – an hour: cho phép cache dữ liệu website của bạn lên trình duyệt web trong vòng 1 giờ.
- Edge Cache TLL – a month: cho phép cache dữ liệu website của bạn lên máy chủ của CloudFlare trong vòng 1 tháng.
Dấu * ở cuối URL nhằm áp dụng quy tắc cho toàn bộ các link con. Nhớ thay https://tenmiencuaban.com bằng tên miền website của bạn.
Click vào nút Save and Deploy để hoàn tất.
4. Danh sách các page rule đã tạo sẽ được hiển thị bên dưới. Chúng trông như thế này:
Nếu muốn tắt page rule đi, bạn chỉ cần chuyển trạng thái từ On sang Off là được.
5. Quay trở lại website của bạn, truy cập ở chế độ ẩn danh trên trình duyệt (hoặc đăng xuất khỏi tài khoản quản trị). Với trình duyệt Chrome, click chuột phải vào giao diện website, chọn Inspect => chọn tiếp tab Network => load lại website.
Kiểm tra xem đã thấy dòng cf-cache-status: HIT trên Response Headers hay chưa? Nếu rồi thì có nghĩa là bạn đã kích hoạt tính năng cache toàn bộ dữ liệu website trên CloudFlare thành công.
6. Kết nối tài khoản CloudFlare với plugin tạo cache mà bạn đang sử dụng trên website để nó tự động xóa cache khi dữ liệu website thay đổi. Nếu plugin tạo cache của bạn không có tính năng kết nối với CloudFlare, hãy cài thêm plugin CloudFlare được download tại đây.
Tham khảo thêm: Kết nối CloudFlare CDN với plugin LiteSpeed Cache
Xử lý lỗi cache Admin Bar
Khi bạn cache toàn bộ dữ liệu website lên CloudFlare, đồng nghĩa với việc cả Admin Bar (thanh công cụ quản trị) cũng bị cache. Khách truy cập của bạn sẽ nhìn thấy Admin Bar, mặc dù họ không hề đăng nhập tài khoản. Để giải quyết tình trạng này, các bạn có thể làm như sau:
- Nếu website chỉ có mình bạn được phép đăng nhập, hãy truy cập Users => Profile => Bỏ tick trong mục Show Toolbar when viewing site đi là được.
- Nếu website cho phép nhiều người đăng nhập, hãy chèn code sau đây vào file
functions.phpcủa theme mà bạn đang sử dụng hoặc chèn thông qua plugin Code Snippets.
add_filter('show_admin_bar', '__return_false');Thật đơn giản phải không nào? Chúc các bạn thành công!
Bạn có đang sử dụng CloudFlare CDN trên website của mình hay không? Bạn đánh giá thế nào về chất lượng của dịch vụ này? Đừng quên chia sẻ với chúng tôi những kinh nghiệm sử dụng CloudFlare của bạn trong khung bình luận bên dưới.
Nếu bạn thích bài viết này, hãy theo dõi blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất nhé. Cảm ơn rất nhiều. :)
Mình bị như thế này thì sao nhỉ. Do mình mới cài lại web mà nó vẫn lưu vài chỗ ở web cũ
cache-control: public, max-age=0
cf-cache-status: DYNAMIC
cf-cache-status: DYNAMICnghĩa là CloudFlare chưa cache toàn bộ dữ liệu bao gồm cả HTML mà chỉ cache file tĩnh như CSS, JS, hình ảnh… thôi bạn nhé.Vậy có cách gì để cache hết tất cả file luôn ko bạn
Bạn đã tạo Rule theo hướng dẫn trong bài viết chưa?
Mình làm theo rồi mà ko được. Nó báo như vậy đó. Mình đợt trước dùng betheme có chèn text ở footer. Nhưng mình cài mới lại hết mà nó vẫn hiện đoạn text đó. Mà giờ nó vẫn còn. Hay là mình cache link /betheme/footer.php nhỉ
Cảm ơn anh. Nhưng e làm thì nó báo lỗi 525 với nội dung “this page is current oflien…” là sao ạ
Bạn thiết lập CloudFlare chưa đúng cách chăng? Tham khảo bài viết “Làm thế nào để sử dụng CloudFlare một cách hiệu quả?” xem sao nhé.
e thiết lập như bài này đó anh
Nếu vậy thì bó tay rồi. Có thể là xung đột với host hoặc mã nguồn website của bạn. Phải kiểm tra thì mới biết được.
Cái này có áp dụng được với Plugin Autoptimize không nhỉ. Mình test thử nó toàn báo no-cache http://prntscr.com/jq6sh6
Site bán hàng mà cache cái này thì khỏi buôn bán gì luôn. Vì nó là dạng cache nguyên page. Cache luôn giỏ hàng, trang thanh toán… Muốn bypass cache theo cookie thì phải nâng cấp lên gói Business ($200/tháng). :P
Mà giờ mình bắt buộc phải dùng nó để chống DDOS thì có cách nào chống cache trang giỏ hàng ko anh?
Cái này có 2 phương án nhé:
1. Sử dụng CloudFlare Automatic Platform Optimization giá $5/tháng.
2. Thử sử dụng plugin Super Page Cache for Cloudflare.
Cảm ơn anh nhé
Cho mình hỏi cài cái này có phải chống được DDOS ko nhỉ
Có bạn nhé.
Muốn dùng cache thì phải bật đám mây vàng lên đúng không anh ? Mà hosting ở singapore bật lên thì làm web chậm hơn, anh biết cách cấu hình tự động bật đám mây vàng khi bị ddos và tự tắt sau vài tiếng sau không ?
Đúng rồi bạn. CloudFlare không có cái tính năng tự động như bạn nói đâu nhé. Mình đang dùng gói trả phí cũng không có chứ đừng nói miễn phí. :)
:) nếu mà post bài thường xuyên thì nó có ảnh hưởng đến trang chủ ko cập nhật bài viết mới không bác
Cài thêm plugin CloudFlare vào nó tự động xóa cache khi có nội dung mới được đăng tải nhé.
Cảm ơn bài viết hữu ích của anh!
Chào bạn
Mình làm theo hướng dẫn của bạn nhưng đến bước kiểm tra thì cf-cache-status: Miss
Bạn có thể hướng dẫn mình kết nối cloudfare với litespeed cache được không, mình thấy ls cache cũng có hỗ trợ cdn
Thks bạn!
Thử F5 vài lần đi bạn. Muốn kết nối LiteSpeed Cache với CloudFlare thì vào LiteSpeed Cache => Settings => CDN => Chuyển mục CloudFlare API sang trạng thái On. Điền đầy đủ thông tin vào 3 mục bên dưới rồi Save Changes là được.
Phần Enable CDN, CDN Mapping và những phần khác có phải nhập không bạn
Mình vừa làm theo nhưng f5 vẫn báo miss
Không bạn. Chỉ có phần CloudFlare API thôi. Mấy cái bên trên không liên quan.
cảm ơn những hướng dẫn của bạn
Cái này h mới biết. Trước em cứ cài cloudflare rồi vứt đó thôi.