Complete Cloudflare Load Balancer Setup - Add Your Vercel Deployment

What You Need Before Starting

1. Cloudflare Account - Go to cloudflare.com and sign up (free)
2. Your Domain Managed by Cloudflare - Your domain's nameservers point to Cloudflare
3. Working Vercel Deployment - Your app deployed at your-app.vercel.app
4. Cloudflare Business or Enterprise Plan - Load Balancer only works on paid plans ($200+/month)

If you don't have Business plan yet, don't worry - we'll upgrade in Step 1.

CRITICAL: Understand the Cost

Cloudflare Load Balancer Pricing:

• Business Plan: $200/month (includes 1 load balancer + up to 2 pools)
• Enterprise Plan: Custom pricing (unlimited load balancers + pools)
• Cost per additional pool: Included in Business plan

This is the main expense. If you only want to use Vercel without redundancy, keep Vercel Pro ($20/month) - cheaper than load balancer.

Only proceed if you have budget for Cloudflare Business.

Step 1: Verify Your Vercel Deployment Works

Before touching Cloudflare, ensure Vercel is working perfectly.

Test Your Vercel App

Open your browser:

https://your-app.vercel.app

You should see your app loading without errors.

Find Your Exact Vercel URL

1. Go to vercel.com dashboard
2. Select your project
3. Go to Settings → Domains
4. You'll see your default domain: your-app.vercel.app

Copy this exact URL - you'll need it in a few minutes.

Step 2: Add Health Check Endpoint to Vercel

Load Balancer constantly checks if your origin is healthy by hitting an endpoint.

Create Health Endpoint (Next.js App Router)

Create new file: app/api/health/route.js

javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
export async function GET(request) {
  return Response.json(
    {
      status: "healthy",
      timestamp: new Date().toISOString(),
      uptime: process.uptime(),
    },
    {
      status: 200,
      headers: {
        "Cache-Control": "no-cache, no-store, must-revalidate",
        "Content-Type": "application/json",
      },
    }
  );
}

Create Health Endpoint (Next.js Pages Router)

Create new file: pages/api/health.js

javascript
1
2
3
4
5
6
7
8
export default function handler(req, res) {
  res.setHeader("Cache-Control", "no-cache, no-store, must-revalidate");
  res.status(200).json({
    status: "healthy",
    timestamp: new Date().toISOString(),
    uptime: process.uptime(),
  });
}

Deploy to Vercel

bash
1
2
3
git add .
git commit -m "add: health check endpoint"
git push origin main

Wait for deployment to complete (1-2 minutes).

Test Your Health Endpoint

In terminal:

bash
1
curl https://your-app.vercel.app/api/health

Expected response:

json
1
2
3
4
5
{
  "status": "healthy",
  "timestamp": "2025-10-21T10:30:00.123Z",
  "uptime": 3600
}

HTTP Status should be 200 OK

If you get 404 or error, deployment didn't work. Wait a few seconds and try again.

Step 3: Upgrade Cloudflare to Business Plan

Load Balancer only available on Business plan.

Go to Billing

1. Open dash.cloudflare.com
2. Select your domain in left sidebar
3. Go to Billing and Subscriptions
4. Click Plan

Upgrade to Business

1. You'll see current plan (Free/Pro)
2. Click on Business option
3. Click Change Plan button
4. Add payment method if needed
5. Confirm upgrade

⚠️ You'll be charged immediately.

After upgrade completes (takes a few minutes), refresh the dashboard.

Verify Business Plan Activated

1. Go to left sidebar menu
2. Look for Traffic option (only visible on Business+)
3. Under Traffic, you should see Load Balancing

If you don't see it yet, wait 5 minutes and refresh.

Step 4: Create Health Monitor

Health monitors check if your origin is alive.

Go to Load Balancing Section

1. Open dash.cloudflare.com
2. Select your domain
3. Left sidebar → Traffic
4. Click Load Balancing
5. You'll see tabs: Monitors | Pools | Load Balancers

Create New Monitor

1. Click Monitors tab
2. Click Create Monitor

Fill In Monitor Settings

Basic Settings:

• Monitor Name: vercel-health-monitor
• Type: Select HTTP
• Port: 443 (HTTPS)
• Method: GET
• Path: /api/health
• Interval: 60 (seconds - check every 60 seconds)
• Timeout: 5 (seconds - wait max 5 seconds)
• Retries: 2 (mark unhealthy after 2 failed checks)

Expected Response:

• Expected Code: 200
• Expected Body: Leave blank (just check for 200 status)

Advanced Settings (scroll down):

• Description: Health check for Vercel deployment
• Leave everything else default

3. Click Create button

Step 5: Create Origin Pool

Origin pool = your Vercel deployment (one server/group).

Go to Pools Tab

1. Still in Load Balancing section
2. Click Pools tab
3. Click Create Pool button

Fill In Pool Settings

Pool Configuration:

• Pool Name: vercel-primary
• Description: Primary Vercel deployment

Origins:

• Click Add Origin
• Origin Address: Paste your Vercel URL: your-app.vercel.app
• Origin Name: vercel-1
• Click Save Origin

Monitor:

• Select: vercel-health-monitor (the one you just created)

Health Check Regions:

• Leave default (monitors from multiple Cloudflare locations)

3. Click Save and Deploy button

You should see status: "Healthy" (might take 30 seconds for first check)

Step 6: Create Load Balancer

Now connect everything together.

Go to Load Balancers Tab

1. In Load Balancing section
2. Click Load Balancers tab
3. Click Create Load Balancer button

Configure Load Balancer

Hostname Configuration:

• Hostname: Enter your desired subdomain
  • Example: app.yourdomain.com OR www.yourdomain.com
• Description: Load balancer with Vercel
• TTL: 30 (seconds - how long to cache DNS)

Default Pools:

• Choose Pool: Select vercel-primary (your Vercel pool)
• Pool Weight: 1 (100% traffic goes here)

Failover Pools (Optional):

• Leave empty for now (add later when you deploy to Cloudflare Pages or Netlify)

Additional Settings:

• Session Affinity: None (recommended for stateless apps)
• Steering Policy: Round Robin (only matters with multiple pools)
• Adaptive Routing: Leave unchecked

3. Click Save and Deploy button

Status should show: "Deployed"

Step 7: Update Your DNS Records

Your load balancer is now running but traffic isn't routing to it yet. You need to update DNS.

Go to DNS Section

1. Left sidebar → DNS
2. You'll see your domain's DNS records

Find or Create Your Main Record

Look for a record named:

• @ (root domain) OR
• www OR
• app

Depending on what hostname you chose in Step 6.

If it doesn't exist, create it:

1. Click Add Record
2. Type: CNAME
3. Name: Whatever you chose in Step 6 (app / www)
4. Content: Leave empty for now, we'll get it in next part
5. Proxy Status: Proxied (orange cloud)
6. Click Save

Get Your Load Balancer CNAME

1. Go back to Traffic → Load Balancing
2. Click Load Balancers tab
3. Click your load balancer name
4. Copy the CNAME value shown
   • Format: your-lb-id.us.cloudflare.com

Update DNS Record

1. Back to DNS section
2. Find the record you just created
3. Click Edit
4. Content: Paste the load balancer CNAME
5. Proxy Status: Make sure it's Proxied (orange cloud, not gray)
6. Click Save

Step 8: Wait for DNS Propagation

DNS changes take time to spread globally.

Verify DNS Updated

Wait 5-10 minutes, then test:

bash
1
2
3
4
5
6
7
8
9
.notExecutable
# On Mac/Linux
nslookup app.yourdomain.com
 
# On Windows
nslookup app.yourdomain.com
 
# Using curl
curl -I https://app.yourdomain.com

You should see responses coming from your Vercel app.

Test Your Load Balancer URL

1. Open browser
2. Visit: https://app.yourdomain.com
3. Your app should load normally

If it shows Cloudflare error page:

• DNS hasn't propagated yet (wait 10 more minutes)
• Or pool is marked unhealthy (check health check endpoint)

Step 9: Verify Everything Works

Check Pool Status

1. Traffic → Load Balancing → Pools
2. Find vercel-primary pool
3. Should show green checkmark (✔) = Healthy

If red X (✘) = Unhealthy:

• Health endpoint might be failing
• Test: curl https://your-app.vercel.app/api/health
• Should return HTTP 200

Check Load Balancer Status

1. Traffic → Load Balancing → Load Balancers
2. Find your load balancer
3. Should show green checkmark (✔) = Deployed

Test Real Traffic

1. Visit https://app.yourdomain.com
2. Refresh several times
3. App should load every time without errors

Check Analytics

1. Traffic → Load Balancing
2. You should see traffic metrics
3. Shows how many requests are going through

Common Issues & Fixes

Issue: "DNS CNAME not found" or 404 error

Solution:

1. Wait 10+ minutes for DNS propagation
2. Clear browser cache (Ctrl+Shift+Delete)
3. Verify DNS record is Proxied (orange cloud)

Issue: Pool shows "Unhealthy" (red X)

Check your health endpoint:

bash
1
curl -v https://your-app.vercel.app/api/health

Should return:

• HTTP 200 status
• JSON response with "status": "healthy"

If failing:

1. Health endpoint code has error
2. Redeploy Vercel: git push origin main
3. Wait 1-2 minutes for deployment
4. Test health endpoint again

Issue: Health check timeout

If health endpoint is slow:

1. Go to Traffic → Load Balancing → Monitors
2. Click your monitor
3. Increase Timeout from 5 to 10 seconds
4. Increase Retries from 2 to 3
5. Save

Issue: Can't upgrade to Business plan

Reasons:

• Need valid payment method
• Account too new (wait 24 hours)
• Try using credit card instead of digital wallet

Contact Cloudflare support if issues persist.

What Happens Next

You now have:

✔ Vercel app running at your-app.vercel.app ✔ Cloudflare Load Balancer at app.yourdomain.com ✔ Health monitoring every 60 seconds ✔ Automatic failover ready (when you add more origins)

To Add More Origins (Later)

When you deploy to Cloudflare Pages or Netlify:

1. Create health endpoint on new platform
2. Create new pool in Cloudflare (Pools tab)
3. Add new pool to load balancer
4. Change to Round Robin or Weighted distribution
5. Test failover

Monitoring Going Forward

Daily Checks

1. Visit Traffic → Load Balancing
2. Verify all pools show green checkmark (✔)
3. Check traffic is flowing normally

Set Up Alerts (Optional)

1. Go to Notifications (left sidebar)
2. Create alert for "Load Balancer Origin Health"
3. Get notified if origin goes down

View Logs

1. Analytics → Traffic
2. See all requests coming through load balancer
3. Monitor response times and errors

Security Notes

• All traffic goes through Cloudflare (HTTPS encrypted)
• Cloudflare provides DDoS protection automatically
• Your Vercel URL is hidden from public (not directly accessible anymore)
• Only app.yourdomain.com is publicly known