What happens behind the scenes when we implement a dynamic header using Cloudflare

Ask us anything
1

I am about to migrate a client away from using a static collection and static collection page to a dynamic version. In order to mitigate the negative impact this will have on their SEO, I would like to implement the Cloudflare solution outlined here.

As I will be making updates to a production application I would like to understand better what will happen behind the scenes. I think I will be able to follow the tutorial but I want to understand what it is I am doing.

Would it be possible for someone from the dev team to create a diagram to support the information given in the tutorial? Ideally, this would start at the point of a user navigating to the collection page and end with the metadata being updated.

I was trying to put this together myself and it highlighted how little I know about what will actually be happening behind the scenes. My current understanding is something like this:

  1. User request collection page
  2. Magic happens
  3. The page is loaded
  4. The collection item is loaded
  5. The header is updated.

Perhaps it’s something like this in reality?

  1. User request collection page
  2. The URL is looked up on a DNS which maybe has to be on Cloudflare
  3. The URL is resolved to an IP address that points to coudlfare or maybe WeWeb or Xano
  4. Cloudflare forwards the request to WeWeb… maybe
  5. WeWeb serves the page
  6. But then where does the metadata header come in?

Help!

2

Hi Greg,

Preconditions:

  • your web app is cached by Cloudflare
  • the DNS for the domain resides on Cloudflare
  1. The user types in the URL of your app.
  2. The request goes to DNS, which is on Cloudflare.
  3. The DNS includes a record that points to the Cloudflare worker.
  4. The Cloudflare Worker makes a request to your backend and pulls in the page metadata.
  5. Cloudflare worker inserts the metadata into the page, which is cached on Cloudflare.
  6. The Cloudflare Worker displays the page.

Sorry, no bandwidth available for drawing schematics at this point.

2 Likes