Settings nginx + woocommerce

Hello, I’m having problems in checkout and shopping carts, in normal this can occur due to the cache of these dynamic pages, doubt !?

Do I have to do a different configuration for these pages in easyengine?

1 Like

Hey there, are you using wpfc or wpredis?

What you wanna do is stop the cache as soon as a user adds an item to their basket. You also want to remove woocommerce checkout and other related pages out of the cache completely. In this example, we’ll stop the Shop, My Account, Basket, Checkout, Cart and a few other pages from being cached.

If you don’t change your products often, you can cache the shop and the individual products in my opinion – because. Or you can use the nginx-helper plugin to flush the cache when you update a product, so the shop cache is always up to date.

Assumptions:

In this guide, I will be using the domain yourdomain.com -- replace this with your actual domain, without the www prefix.

I'm using nano as my text editor. When you're connected via ssh, type in nano. If you get a message back saying command not found, run sudo apt-get install nano

I've installed EasyEngine on my server as root. So I need to use sudo when I want to edit core nginx files. If you don't want to type sudo before each command that needs it, just type in sudo -i and that will switch you over to the root account. When you're finished with everything, just type exit and it will switch you back to the user ubuntu


Let’s get started.

SSH into your machine.

Let’s make the file that will tell nginx not to cache important WooCommerce pages: (Below code has been updated 07/05/2017 (DD/MM)

sudo nano /var/www/yourdomain.com/conf/nginx/woo-nginx.conf

Paste in the following (copy it from here, and if you’re using Putty as your SSH client, just right click)

    if ( $cookie_woocommerce_items_in_cart = "1" ){

            set $skip_cache 1;

    }


    # Don't cache uris containing the following segments


    if ($request_uri ~* "(/basket.*|/cart.*|/my-account.*|/checkout.*|/addons.*|/wp-admin/|/xmlrpc.php|wp-.*.php|/feed/|index.php|sitemap(_index)?.xml|[a-z0-9_-]+-sitemap([0-9]+)?.xml)") {

            set $skip_cache 1;

    }

Now we need to save the file and exit nano: Press Ctrl+x, press y to confirm the file overwrite, and hit enter.

We don’t need to tell nginx to include the config file we’ve just made, because it’s already included.

sudo nano /etc/nginx/sites-enabled/yourdomain.com

You’ll notice towards the bottom it says

include /var/www/yourdomain.com/conf/nginx/*.conf

This means that any config file you make inside that directoy will be automatically loaded by nginx, as long as the extension of the file is .conf (For example, if you’ve got SSL enabled via LetsEncrypt, you’ll notice the directory also has ssl.conf. But, ssl.conf isn’t ‘included’ in your nginx.conf file. That’s because there’s no need to. EE has already told nginx to load anything ending in .conf in that specific directory.

Let’s test our new config before we reload nginx: Type in sudo nginx -t, your test should come back successful. We do this to make sure that the web server won’t go down when we reload it. We don’t want any downtime for our visitors.

    sudo nginx -t
    nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
    nginx: configuration file /etc/nginx/nginx.conf test is successful

Great. Now, let’s reload nginx. We can reload nginx in this case, there’s no need to restart it, because we haven’t changed anything critical like the ports it listens on. We’ve just modified the config it loads. Nginx is cable of reloading its config without downtime.

sudo systemctl reload nginx

Now you can verify that your woocommerce pages are not being cached.

I’ll use Chrome as an example here. Open an incognito window (Ctrl+Shift+N). We want to browse the website as a logged out visitor.

Press F12. Go to the Network tab. Then browse to your home page. After the page has finished loading, scroll all the way up in the Network tab. Click on the name of your page (it will just be www.mydomain.com or mydomain.com)

Have a look at the headers of your non-woocommerce pages. You should see

X-SRCache-Fetch-Status:HIT
X-SRCache-Store-Status:BYPASS

When you do this for the first time, the first may be MISS instead of HIT. The second line may be STORE instead of BYPASS.

If it says MISS & STORE, it means that the page was not in the cache, the page was not served from the cache, because there was no copy of it STORED in the cache. But now, a cached copy of the page has been STORED.

You can verify it has been stored in the cache because if you refresh, it will say HIT & BYPASS. This means that your request hit the cache, you were served a cached copy. The BYPASS means that it bypassed saving a copy of the page in the cache, because there was already a valid copy in there.

Browse other pages on your website that aren’t related to WooCommerce and repeat this experiment. See how your pages are being missed, cached, stored and bypassed.

Now, let’s verify that WooCommerce pages are not being stored in or served from the cache: Add something to your cart. Have a look at the headers for your the page you’re on.

Your headers should now read like this

X-SRCache-Fetch-Status:BYPASS
X-SRCache-Store-Status:BYPASS

You’ve bypassed the cache all together, because you’ve added something to your cart.Now browse to another page on your website that isn’t related to WooCommerce (for example, your About Us page). Have a look at the headers again, and it will say BYPASS & BYPASS. The cache is being bypassed everywhere on your website because you’ve got something in your cart.

Now remove the item from your cart. Go back to your About Us page and have a look at the headers, and you’ll see that you’re now being served a cached copy because you don’t have any items in your cart.

Next, without adding anything to your cart, head to the checkout page. Verify that your headers read BYPASS/BYPASS. Although you’ve got nothing in your cart, we’ve told nginx not to cache this page no matter what. Verify this also for the Basket/Cart page, your shop, your product pages, & the My Account

If you’ve changed your WooCommerce links, just edit the code so it’s suitable for you. Meaning, if your shop is /store and not /shop, just change that single word in the code above. If you’ve changed your basket permalink to trolley, change the word basket to trolley in the config above, and so on.

Edited with the fixed code for woo-nginx.conf thanks to @davidsandbrand

1 Like

Very timely question, as I’m doing the same thing right now.

however, I think there’s a quote and close brackets missing in your code above @msarhan

I’ve removed some of the uri’s to not cache, and this is working for me;

if ( $cookie_woocommerce_items_in_cart = “1” ) { set $skip_cache 1; }

if ($request_uri ~* “(/shop|/basket|/cart|/my-account|/checkout)”) { set $skip_cache 1; }

Thanks for pointing me in the right direction!

David.

Ah thanks for correcting that. I got the code from github or the tutorial page I think, not the actual code I’m using myself (I’m caching my store as the products don’t update often)

Hey Msarhan

I have the same problem as you. I try to tell nginx not to cacje the shop page but dont know really how. Would you be willing to help out?

Kind Regards

Lars