Sometimes you need to schedule builds for your static site. You might have scheduled content or some other changes that will happen based on a specific date (like your Christmas opening hours!).
I previously wrote about scheduling builds in Netlify and Vercel with GitHub Actions. You can do the same with Cloudflare Pages, but you can also do it without Github Actions (or any other outside service).
Here's how you can set it up.
Add a deploy hook
First things first, you will need a deploy hook for your Cloudflare Pages site. I'm assuming you have a Cloudflare Pages site - if you don't, you are going to struggle to follow this guide - so get set one up. It will only take a couple of minutes!
Ok, you got your Cloudflare Pages site up and running? Let's begin.
To set up your deploy hook go to:
Pages > Your Site > Settings > Deploy hooks > Add deploy hook
Give it a name, something like scheduled-build
will work, and the branch you want it to build (main
by default for your production site).
Click Add, and Cloudflare will give you a shiny new deploy hook. Something like:
https://api.cloudflare.com/client/v4/pages/webhooks/deploy_hooks/random1-deploy2-3hook-something4-5else
Copy your deploy hook, you will need it again shortly.
Now you can call this deploy hook from somewhere, and it will trigger a build. You can do this from places like:
- IFTTT
- Zapier
- GitHub Actions
So if you already have automatic builds set up for a static provider, like Netlify or Vercel, you could carry on using your existing setup, and update the URL to Cloudflares deploy hook instead.
That's what I was going to do when I moved my static site to Cloudflare. But... I noticed that Cloudflare have cron jobs. So I wondered if it's possible to get scheduled builds working within Cloudflare instead of using an external service like IFTTT or Zapier. Spoiler alert - it is!
Set up workers
From the Cloudflare dashboard, head over to the Workers menu item.
If it's your first time accessing Cloudflare workers - like it was mine - you will need to set things up.
First, select a free custom subdomain - your workers will then be accessible from your-worker.your-custom-subdomain.workers.dev
.
Next, pick a plan. You’ll be fine to start on the free plan since you get 100,000 requests a day, and this scheduled build will likely use only one of those requests. So 100,000 is plenty to start!
Add a worker
Now we are ready to create our worker. A Cloudflare Worker is a serverless function that runs some JavaScript code. Our code will call our deploy hook to trigger a build.
Start by clicking the Create a Service button.
Now you can give the worker a name, something like scheduled-deploy-hook-worker
or whatever better name you come up with. And select HTTP handler (don’t worry about the example code, we will change this in a moment). Now click Create service.
Great, we have our worker, and we are ready to code. Click the Quick edit button so you can get the worker set up.
Since this worker only needs to run on scheduled events, let's listen for scheduled events.
addEventListener('scheduled', event => {
event.waitUntil(
handleSchedule(event.scheduledTime)
)
})
async function handleSchedule(scheduledDate) {
// do something
};
Ok, now we need to send a POST
request to that build hook we created earlier. So let's do that with fetch
.
addEventListener('scheduled', event => {
event.waitUntil(
handleSchedule(event.scheduledTime)
)
})
async function handleSchedule(scheduledDate) {
let deployHook = "https://api.cloudflare.com/client/v4/pages/webhooks/deploy_hooks/random1-deploy2-3hook-something4-5else";
await fetch(deployHook, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
});
return "Called deploy hook!";
};
Don't forget to update the deploy hook with the one you created earlier!
Click Save and deploy to be taken back to the worker page.
Add a trigger
Now you have a deploy hook, and a worker that calls that deploy hook. You are nearly done! Last, but not least, we need to trigger when we want the worker to run.
And a cron job will do exactly that.
On the worker page, we are now going to create the cron job to trigger the worker. In the worker menu (below the preview panel at the top) click the Triggers tab.
Scroll down to Cron triggers and click the Add Cron Trigger button.
I want my build to happen every morning, around 9 am. So I'll pick to execute the worker every Day of the week
at 08.45
(a little earlier than my desired time to be on the safe side!). You can pick whatever schedule works for you.
I’m in the UK, so UTC works for me. If you are somewhere else in the world, you may need to adjust from your local time to set a UTC that matches what you need.
You don’t even need to set a specific time each day, you could choose to trigger a build every 12 hours, or only on Mondays.
When you are done making your schedule, click Add Trigger. Now you have an automated build schedule for your Cloudflare Pages website. Nice!