Skip to content

Use Pages as an origin for Load Balancing

Last reviewed: 6 months ago

This tutorial is intended as an introductory example of how you can leverage Cloudflare's global traffic management.

The following sections will guide you through setting up an active-passive failover load balancer with Cloudflare Pages as one of the endpoints, while also going into details about the Load Balancing dashboard workflow, and some important field values and troubleshooting.

Use cases

This setup can be useful if you are migrating your production website or application to Pages or if you just want to have a backup or a personalized web page for when your primary origin goes down.

Before you begin

Make sure you:

Create health monitor

Although you can create all the components in the Create Load Balancer workflow, using the Manage Monitors and Manage Pools sections separately makes it easier to test and troubleshoot the configurations of each of these components before bringing them together in a load balancer.

Monitors define the criteria based on which an endpoint will be considered healthy or not. Start by setting up a monitor as follows.

  1. Log in to your Cloudflare account and select your domain.
  2. Go to Traffic > Load Balancing.
  3. Select Manage Monitors and then Create.
  4. Give the monitor a descriptive name and confirm the other fields are filled in as the following:
FieldValue
TypeHTTP
Path/
Port80
  1. Under Advanced health check settings, keep the default values and enable the Follow Redirects option.

    When you are using a service like Cloudflare Pages, it is possible that requests from the health monitor - as well as the ones from your visitors - are redirected before reaching their destination. Enabling this option prevents the monitor from reporting an unhealthy endpoint when it actually has only been redirected (with a 301 code, for example).

  1. Select Save to confirm.

Create pools

Pools hold information about where the health monitor requests and your visitors requests will be directed to.

To support the use cases mentioned above, and assuming you only have one origin server for your production website and one for the Cloudflare Pages instance, create two pools with one endpoint each:

  1. Go to Traffic > Load Balancing.

  2. Select Manage Pools and then Create.

  3. For the first pool, start by filling out the fields:

  • A name for the pool (must be unique). Suggestion: primary
  • A description to provide more details on the name. Suggestion: production website
  1. Leave the choice for Endpoint Steering as is. Since each pool will only have one endpoint, this steering method will not interfere in this case.

  2. Add your origin server as an endpoint with the following information:

  • A name for the endpoint (must be unique). Suggestion: my-website.

  • The endpoint IP address or hostname.

  • The endpoint weight, which can be set to 1. Since each pool will only have one endpoint, the endpoint weight will not make a difference in this case.

  • A hostname by selecting Add host header.

  1. Finish configuring the first pool with the following information:
  • Leave the Health Threshold set to 1. Since each pool will only have one endpoint, this is the only possible value for this field.
  • Select the Monitor configured in the previous step.
  • Select Health Check Regions to choose from which locations Cloudflare should send monitor requests to periodically test the endpoint health.
  1. Select Save

  2. Repeat the process for the second pool using the following values:

FieldValue
Pool namesecondary
DescriptionPages version
Endpoint steering<default>
Endpoint namemy-pages-website
Endpoint address<your custom domain or Pages subdomain>
Weight1
Host (Add host header)<your custom domain or Pages subdomain>
Health threshold1
Monitor<monitor defined on previous step>
Health check regions<select region of your choice>

Check the endpoints health status

Before setting up the load balancer:

  1. Go to Traffic > Load Balancing > Manage Pools.
  2. Find the pools you created in the list and check if their status is Healthy. You might have to refresh the page.
  3. Expand each pool entry to confirm that the health status for endpoints within them is also Healthy.

The basic principle is that, if both your production website and your Cloudflare Pages project are live and directly accessible via browser, the monitors should also be able to get a 200 code as HTTP response.

Revise your pools and monitor configurations to confirm they followed the instructions above. If you still find issues, refer to Troubleshooting or FAQ.

Create load balancer

After confirming the endpoints and monitors are set up correctly and return the expected health status, create the load balancer:

  1. Go to Traffic > Load Balancing > Create Load Balancer.

  2. On the Hostname page, configure the following and select Next.

    • Enter a Hostname, which is the DNS name at which the load balancer is available. Suggestion: for now, you can just add a temporary hostname such as lb (so the complete field value would look like lb.<your_domain>).
    • Toggle the orange cloud icon to update the proxy mode, which affects how traffic is routed and which IP addresses are advertised.
    • Select your preferred option for session affinity and adaptive routing.
  3. On the Add a Pool page, configure the following and select Next.

    • Select the first pool you created previously and select Add Pool.
    • Do the same for the second pool and reorder them if needed. For the purposes of this tutorial, your production website pool would be the first (primary) and the Cloudflare Pages pool would be the second (secondary).
    • If needed, update the Fallback Pool. For the purposes of this tutorial, you can leave this pointing to your secondary pool.
  4. On the Monitors page, review the monitors attached to your pools and the expected health status, and select Next.

  5. On the Traffic Steering page, make sure Off is selected. This means the load balancer will follow the order established on the Add a Pool section (Step 3 above), achieving an Active - Passive Failover configuration.

  6. For the purposes of this tutorial, leave the Custom Rules option empty.

  7. On the Review page, review your configuration and select Save as Draft.

A DNS record of the type LB will be created under DNS > Records with the hostname you have defined, and a corresponding load balancer will be added to Traffic > Load Balancing > Manage Load Balancers

Optional - Deploy on a test hostname

If you have used a temporary hostname for your load balancer, follow the steps below to deploy and test it.

  1. Go to Traffic > Load Balancing.

  2. In the Manage Load Balancers list, locate the load balancer you created under a test hostname (such as lb) and enable it.

  3. On your browser, request the temporary hostname (lb.example.com). You should see the website or application hosted at your primary origin server.

  4. Go back to the Manage Load Balancers list, select to expand the test load balancer, and disable the primary pool.

  5. On a new incognito window of your browser, request the temporary hostname once again. You should see the website or application hosted at your secondary origin server this time.

    If you find issues, revise your pools, monitor, and load balancer configurations to confirm they followed the instructions above. Also refer to Troubleshooting or FAQ if needed.

Route production traffic to load balancer

Now that you have set up your load balancer and verified everything is working correctly, you can put the load balancer on a live domain or subdomain:

  1. Confirm that your production hostname has the correct priority order of DNS records and is covered by an SSL/TLS certificate.

    If you have an Enterprise account, also evaluate your application for any excluded paths. For example, you might not want the load balancer to distribute requests directed at your /admin path. For any exceptions, set up an Origin rule or Page rule.

  2. Configure your load balancer to receive production traffic by editing the Hostname of your existing load balancer.