Cloudflare workers Continuous Deployment with Github Actions
Tags: github, actions, serverless, cloudflare
Published: 2021-11-02 20:33:36

In the previous post I went through using Cloudflare's `wrangler` tool to set up Clouflare Workers using a config as code approach. This approach needed to be run from a local machine. While this allows changes to be tracked in version control it leaves room for what's running and what's in version control to be out of sync.  
A better solution is to have changes pushed into the main branch automatically deployed into the production environment. 

This post will go through taking the example from the previous post and setting it up to deploy to Cloudflare on each push to the main branch. I will do this using Github Actions.   


Cloudflare have provided [a base action](https://github.com/marketplace/actions/deploy-to-cloudflare-workers-with-wrangler) that can be used to deploy workers from Github Actions.  

To get this functioning I'll add a new file to the repository. `.github/workflows/buildAndDeploy.yml`. This file will include the following text taken from the actions readme. 

```yaml
name: buildAndDeployWorker
on: push
jobs:
  deploy:
    runs-on: ubuntu-latest
    name: Deploy
    steps:
      - uses: actions/checkout@v2
      - name: Publish
        uses: cloudflare/wrangler-action@1.3.0
        with:
          apiToken: ${{ secrets.CF_API_TOKEN }}
```

The `${{ secrets.CF_API_TOKEN }}` subs in a secret value that needs to be provided in the Github API. Before I can put that into Github I have to get it from Cloudflare.  

To create a new token I need to:
Log in to Cloudflare, open the workers tab and then select Manage Workers.  

![Open workers management console](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/udxqutexzro893t6vim6.png)

Select API tokens. 

![Select API Tokens](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5ap56hxf7aw6kmwq6c42.png)

Create a new API token

![Create a new token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h78tp9fky3foxi62rl0u.png)

Start with the cloudflare workers template
 
![Use the workers template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vc9ys0psf4k120vrayiy.png)
 
Give the token a meaningful name 

![meaningful name](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/27afc6yep4640mmgkvm4.png)
 
Limit the resources the token has to my account and the saladsimulator zone. 
![Limit the token to your account and zome](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5gsah0jm6lsrcelyzwjh.png)

Continue to the summary 
![Continue to summary](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ciczcm4o19xbla5k2noh.png)

And create the token
![Create the token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9btmk1ske51d8yyqlryq.png)
 
Now Cloudflare will display the API token. Once this page is closed the token is gone so I need to immediately copy it into Github. (I can re-run through the steps above to generate a new one if I need to.)

![Cloudflare secret display](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/srf6cbmrnpvv6vbf0z16.png)
 

Over in github I've opened the settings tab and secrets section.
![Add new secret section](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eenxx9bhl7lm47os4roc.png)

And added my secret copied from Cloudflare
![Add secret](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rhwhro0a3kmssvkcey8p.png)
 
Now when I push the action code it runs and deploys to Cloudflare 

![Successful actions build](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xb5w437mgas59rbrfb9z.png)
 
The logs show the successful deployment output from `wrangler`. 
```bash
Downloading release from https://workers.cloudflare.com/get-npm-wrangler-binary/1.19.3/x86_64-unknown-linux-musl
wrangler has been installed!
+ @cloudflare/wrangler@1.19.3
added 22 packages from 9 contributors in 2.082s
 No build command specified, skipping build.
 Successfully published your script to
 foo.saladsimulator.com/* => stayed the same
 https://foo-stage-auth.kleeut.workers.dev
```