Cloudflare is very powerful free CDN provider. There are quite a few WordPress webmasters using Cloudflare who want their websites to be faster. But if you configure Cloudflare to cache all the content of the site (HIT) may make WordPress login and comment errors, such as the front-end does not update or cache the login information of other users. That's why most WordPress sites use CDNs to cache only static files like JavaScript, CSS and images.
Some careful webmasters may have noticed that Cloudflare supports "Caching Static HTML with WordPress/WooCommerce" function, but this is limited toCloudflare Business and Enterprise Program Customersto be able to use it, this feature is not available to free users.
Customers in all Cloudflare plans can configure caching of HTML files. However, only customers in the Business and Enterprise plans can bypass the HTML cache any time a cookie is sent with a request to.
Create Page Rules in theBypass Cache on Cookieset up
This function accomplishes the following:
- Unlogged-in visitors (without log-in cookies) access the site by directly providing a CDN to fully cache the website pages (HIT) without having to go back to the source, increasing speed and reducing the burden on the server;
- Users who are logged in (with login cookies) or who have sent a comment the CDN then sources back and delivers dynamic content (DYNAMIC), ensuring that the front-end is updated in real time;
- At the same time, the two caches are isolated from each other, so that no unlogged-in visitor can see the foreground information of a logged-in user.
As most of the websites (including but not limited to WordPress) are through the setting of Cookies to achieve the user login or comments and other functions, we can let Cloudflare through the determination of Cookies to achieve automatic judgment of the user login and comments, so as to distinguish between whether or not to return to the source. This will not only improve the visitor's experience, but also reduce the burden on the server, and even reduce carbon emissions, why not?
Below, I will use WordPress as an example of how toFreeImplement this feature.
Configure the process:
Note: For easy configuration, all rules are provided with expressions, you can paste the expression into the expression input box and then switch back to the generator for visual editing. Please make sure to replace "Your Domain" with your own domain name.
1. Observing Cookies Characteristics
By reading the official documentation given by Cloudflare, we can find the following pattern:
WordPress (native) | wp-. *|wordpress.*|comment_. * |
WordPress with WooCommerce | wp-. *|wordpress.*|comment_. *|woocommerce_. *|comment_. *|woocommerce_. |
2. Open the configuration page
show (a ticket)Cloudflare Configuration PageClick on the domain name you want to configure - Cache - Cache Rules in order.
3. Create the first cache rule
Create a caching rule as shown below, select "Bypass Cache" and place this rule at the top of the process.
The purpose of this rule is to prevent Cloudflare from caching the admin backend, the frontend user center, the search interface and the preview interface so that it doesn't cache other people's information.
(http.request.full_uri eq "https://您的域名/wp-admin/*") or (http.request.full_uri eq "https://您的域名/*preview=true*") or (http.request.full_uri eq "https://您的域名/前台用户中心/*") or (http.request.full_uri eq "https://您的域名/?s=*")
4. Create a second cache rule
Create a caching rule as shown below, select "Bypass Cache" and place this rule second in the process.
The purpose of this rule is to enable logged in users (with login cookies) or users who have sent a comment to CDN request back to the source and provide dynamic content (DYNAMIC), ensuring that the front-end is updated in real time.
(starts_with(http.request.full_uri, "https://您的域名/") and http.cookie contains "wordpress_sec_") or (starts_with(http.request.full_uri, " https://您的域名/") and http.cookie contains "wordpress_logged_in") or (starts_with(http.request.full_uri, "https://您的域名/") and http.cookie contains "comment_")
5. Create a third cache rule
Create a caching rule as shown below and place this rule at the bottom of this flow.
The purpose of this rule is to realize that unlogged-in visitors (without login cookies) accessing the site are directly provided with a CDN fully caching the site pages (HIT) without the need to go back to the source.
(starts_with(http.request.full_uri, "https://你的域名/") and not http.cookie contains "wordpress_sec_" and not http.cookie contains "wordpress_ logged_in" and not http.cookie contains "comment_")
Select "Cache eligible" here, and the following settings can be used.Configure as you see fit, it is recommended to turn on the following option: Cache Spoofing Armor in order to cache static resources.
6. Check the order of caching rules
Please make sure that the 3 rules are sorted in the above order, you can drag or click on the arrows to re-sort the rules.
7. Validation of the entry into force of the rules
You can open the developer tools by pressing F12 in the InPrivate tab of your browser and check the "cf-cache-status" of the corresponding URL in the Network column. Under normal circumstances, you will see the following, which indicates that the configuration was successful:
- Not logged in: cf-cache-status:HIT
- After login: cf-cache-status:DYNAMIC
If there is a problem, check if there are any items in the "Page Rules" etc. that conflict with it.
Once this configuration is complete, you can check and refine other configurations on your own, which will not be repeated here.
Demonstration
This configuration can have a significant acceleration effect on unlogged-in visitors, while reducing the burden on the server.
I hope this tutorial can help webmasters in need; I also hope Cloudflare can continue to provide excellent acceleration services and develop more advanced features!
References:
- https://developers.cloudflare.com/cache/how-to/cache-rules/
- https://developers.cloudflare.com/support/other-languages/%E7%AE%80%E4%BD%93%E4%B8%AD%E6%96%87/%E4%BD%BF%E7%94%A8-wordpresswoocommerce-%E7%BC%93%E5%AD%98%E9%9D%99%E6%80%81-html/
Note: This article is the result of repeated research and practice, please respect the intellectual property rights of webmasters, reproduced with the source, thank you for your cooperation!
I accidentally found your site, see your site at https://www.itdog.cn/http/测试会有部分地区触发403的质询,请问是怎么设置规则呢? I see that some sites can recognize bots very well, do you have the advanced version of CF pro?
Hello, my site was on the previous Plesk Plus with WAF version of the Cloudflare package, which has now been downgraded to the Free package, and all privileges have been reclaimed except for the customization page, which has been partially retained.
Also, I checked the logs left at Cloudflare during the ITDOG test and confirmed that it was recognized by a custom WAF rule, which consists of two parts, the first allowing requests from search engines and source IPs, and the other part mainly identifying visitors with bad reputations for questioning with ASNs and Threat Scores, and is an improvement on a rule set found on the web.
Thank you for your support, I will send the ruleset to your email address later, together with the reference research.