Setting security headers using Cloudflare workers

Hi!
I have a static website hosted on Github pages and trying to deploy security headers using Cloudflare workers by following this tutorial by Scott Helme.

According to SecurityHeaders.com, I got an F grade, and would like to improve the security of the site.

I am getting an error 522 Origin Connection Time-out.

On my cloudflare SSL/TLS configuration:
Always use HTTPS ON
HTTP Strict Transport Security (HSTS) - Not enabled
Opportunistic Encryption ON
Automatic HTTPS Rewrites ON
TLS 1.3 ON

This is the worker I created:

    let securityHeaders = {
        "Content-Security-Policy" : "upgrade-insecure-requests",
        "Strict-Transport-Security" : "max-age=1000",
        "X-Xss-Protection" : "1; mode=block",
        "X-Frame-Options" : "SAMEORIGIN",
        "Referrer-Policy" : "strict-origin-when-cross-origin",
        "X-Content-Type-Options" : "nosniff",
    "Permissions-Policy" : "geolocation=(), microphone=(), camera=(), payment=()",
    }
    
    sanitiseHeaders = {
        Server: "My server"
    },
    removeHeaders = [
        "Public-Key-Pins",
        "X-Powered-By",
        "X-AspNet-Version"
    ]
    
    addEventListener('fetch', event => {
        event.respondWith(addHeaders(event.request))
    })

    async function addHeaders(req) {
    let response = await fetch(req)
    let newHdrs = new Headers(response.headers)

    if (newHdrs.has("Content-Type") && !newHdrs.get("Content-Type").includes("text/html")) {
    return new Response(response.body , {
        status: response.status,
        statusText: response.statusText,
        headers: newHdrs
    })
    }

    Object.keys(securityHeaders).map(function(name, index) {
        newHdrs.set(name, securityHeaders[name]);
    })

    Object.keys(sanitiseHeaders).map(function(name, index) {
        newHdrs.set(name, sanitiseHeaders[name]);
    })

    removeHeaders.forEach(function(name){
        newHdrs.delete(name)
    })

    return new Response(response.body , {
        status: response.status,
        statusText: response.statusText,
        headers: newHdrs
    })
    }

Any suggestions on what I should do?

Are you sure the DNS records pointing to the GitHub pages site are correct?

I’ve used this code to add security headers to all my Cloudflare Pages sites so I know it works.

@DaServaJesus Thanks for the reply!

The A records are pointing to the IP addresses for GitHub pages

What is your SSL level set to?

My SSL/TLS encryption mode is Full.

What route do you have set for the worker?

And if you change the route to something invalid like example.com/foobar, does the site work?

The site works, I just tested it but the worker doesn’t trigger which makes me think the route isn’t correct

I have it enabled on this route

Change the route so instead of *.freepeoplesearchtool.com/* it becomes *freepeoplesearchtool.com/*

The first one will only apply it to subdomains, the 2nd one applies it to the zone apex as well as subdomains

2 Likes

Thanks @DaServaJesus .
It works now!

If you have any more questions, you can join the discord here

1 Like

So how did this fix the 522 error? I see no connection between a non-existent route to the 522 origin timeout.

I’m not sure what caused the 522 error but it seems to be working now.

Maybe it was just a temporary glitch between CF and GitHub.

1 Like

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.