Setup docs site in Subdirectory of Existing Static Website

I am following an older blog and using a worker to redirect traffic from a subdirectory on one pages site to another pages site.

The route I have in place doesn't get triggered. Should I be using functions instead?

https://qoyyimafiassalam.medium.com/reverse-proxy-with-cloudflare-workers-setup-blog-in-subdirectory-of-existing-static-website-96e4d186d4f0

Medium

Reverse Proxy with Cloudflare Workers: Setup Blog in Subdirectory o...

Blog is an essential part to increase your site’s traffic, authority, and search-engine-related performance. With blog, you can inform…

AJ DanelzOP•4/12/23, 3:59 PM

i created a feature request: https://community.cloudflare.com/t/deploying-pages-sites-to-subdirectories/496408

Cloudflare Community

Deploying pages sites to subdirectories

Based on the discussion on this thread, I would like to formally request the feature to set up a pages site under a subdirectory or route on an existing zone domain. This would also mean nesting multiple pages sites under one domain could be possible. One real example would be a root marketing site, /blogs rendered by JAMstack framework, /docs b...

AAJ Danelz i created a feature request: https://community.cloudflare.com/t/deploying-pages-...

Hello, I’m Allie!•4/12/23, 4:21 PM

Why not just merge those multiple projects into a single one?

HHello, I’m Allie!Why not just merge those multiple projects into a single one?

AJ DanelzOP•4/12/23, 4:44 PM

They are being generated by separate static site generation tools.

AJ DanelzOP•4/12/23, 4:44 PM

And are managed in different repositories.

AJ DanelzOP•4/12/23, 4:45 PM

And SEO isn't good at different subdomains yet... Unfortunately.

AAJ Danelz They are being generated by separate static site generation tools.

Hello, I’m Allie!•4/12/23, 5:01 PM

You could have a GH action that, on an update to either repo, clones both, builds both, and then uploads a single Pages project

AJ DanelzOP•4/12/23, 5:22 PM

Yes we could but we are already doing that for managing multiple versions of our docs https://github.com/vordimous/zilla-docs/blob/develop/.github/workflows/build-deploy-docs.yml#L53 .
It would also mean centralized builds for projects in a different repo which wasn't an ideal plan.

AAJ Danelz Yes we could but we are already doing that for managing multiple versions of our...

Hello, I’m Allie!•4/12/23, 5:24 PM

You could also utilize an external CI/CD system if you have one, but yeah. The current Pages CI isn’t ideal for this kind of site, and tbh, I’m not 100% sure if/how they plan on improving it

AJ DanelzOP•4/12/23, 5:30 PM

So far I have a worker that can route but it looks like I will need an active zone domain to do it.

AAJ Danelz So far I have a worker that can route but it looks like I will need an active zo...

Hello, I’m Allie!•4/12/23, 5:31 PM

You could use a function?

HHello, I’m Allie!You could also utilize an external CI/CD system if you have one, but yeah. The c...

AJ DanelzOP•4/12/23, 5:31 PM

I am using github to build and push the static site which does help. the Pages CI would not handle all of these gymnastics!

HHello, I’m Allie!You could use a function?

AJ DanelzOP•4/12/23, 5:31 PM

ok is that better than a worker? I was trying to use one or the other but can't tell which is designed for proxy style route handling?

AAJ Danelz ok is that better than a worker? I was trying to use one or the other but can't ...

Hello, I’m Allie!•4/12/23, 5:32 PM

Functions are basically just Workers on Pages

AJ DanelzOP•4/12/23, 5:32 PM

my understanding is worker->routing and functions->mock apis

Hello, I’m Allie!•4/12/23, 5:32 PM

They come with some Pages sugar(tied to deployments, built-in router), but they are still Workers under the hood

Hello, I’m Allie!•4/12/23, 5:33 PM

In fact, Pages itself is a Worker too

AJ DanelzOP•4/12/23, 5:34 PM

ok so this is currently working in a Worker and rendering the underlying pages content

AJ DanelzOP•4/12/23, 5:34 PM

There will be a pages site at root (/) of my domain so i could just manage this code as a function on that pages site?

AJ DanelzOP•4/12/23, 5:35 PM

This root pages site is also where I am managing robots.txt and sitmaps and such

AAJ Danelz There will be a pages site at root (/) of my domain so i could just manage this ...

Hello, I’m Allie!•4/12/23, 5:36 PM

Give me a second, and I'll rewrite it. Just wondering though, do you know if the GH Actions cache applies across different repositories?

HHello, I’m Allie!Give me a second, and I'll rewrite it. Just wondering though, do you know if the...

AJ DanelzOP•4/12/23, 5:37 PM

Unfortunately, it does not. It doesn't even persist across branches!!!! It is a good thought and one I have tried.

AJ DanelzOP•4/12/23, 5:37 PM

This whole experience will be a blog post in my future i think

AAJ Danelz Unfortunately, it does not. It doesn't even persist across branches!!!! It is a ...

Hello, I’m Allie!•4/12/23, 5:39 PM

Might be slightly hackier, but you could cache the build output in R2?

Original message was deleted

Hello, I’m Allie!•4/12/23, 5:41 PM

I just remembered, you can also just rename that file to

_worker.js

_worker.js

, and put it in the output directory of your Pages project.

HHello, I’m Allie!Might be slightly hackier, but you could cache the build output in R2?

AJ DanelzOP•4/12/23, 7:18 PM

This is my last resort plan

HHello, I’m Allie!I just remembered, you can also just rename that file to `_worker.js`, and put i...

AJ DanelzOP•4/12/23, 7:18 PM

oh cool Ill try this out and see what i can get to work. Thank you for all of the help!!

AJ DanelzOP•4/12/23, 7:53 PM

@HardAtWork https://aklivity-docs.pages.dev/zilla/next

Zilla Docs

Home

Zilla is open-source software connecting web and mobile applications to event-driven microservices using standard protocols, such as HTTP, Server-Sent Events and Kafka. Zilla is...

AJ DanelzOP•4/12/23, 7:53 PM

nice even the card works

AJ DanelzOP•4/12/23, 7:53 PM

I am using this with a local

_redirects

_redirects

file as well.

AJ DanelzOP•4/12/23, 7:55 PM

Also a the generic worker I added yesterday with a route of docs-portal.pages.dev/*docs-portal.pages.dev/* started working today randomly so that is a viable option.

AJ DanelzOP•4/12/23, 7:56 PM

However, I like the

_worker.js

_worker.js

option better since it keeps everything in one place.

AJ DanelzOP•4/12/23, 8:11 PM

the third pages site being served: https://docs-portal.pages.dev/msk-proxies/next/

Amazon MSK Proxies

Home

Help & Support If you have any questions or run into bugs or issues, reach out on the Aklivity Community Slack Workspace (https://join.slack.com/t/aklivitycommunity/shared\_invi...

AJ DanelzOP•4/12/23, 8:12 PM

updated worker code:

AJ DanelzOP•4/12/23, 8:12 PM

const PATHS = {
  zilla: "zilla",
  mskProxies: "msk-proxies",
};

const SITES = {
  [PATHS.zilla]: "zilla-docs.pages.dev",
  [PATHS.mskProxies]: "msk-proxies-docs.pages.dev",
};

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    const origin = url.hostname;

    // Check if incoming hostname is a key in the SITES object
    if (url.pathname.startsWith(`/${PATHS.zilla}/`) || url.pathname === `/${PATHS.zilla}`) {
      console.log(`found: /${PATHS.zilla}/`);
      const target = SITES[PATHS.zilla];
      url.hostname = target;
    }
    
    if (url.pathname.startsWith(`/${PATHS.mskProxies}/`) || url.pathname === `/${PATHS.mskProxies}`) {
      console.log(`found: /${PATHS.mskProxies}/`);
      const target = SITES[PATHS.mskProxies];
      url.hostname = target;
    }
    
    if (url.hostname != origin) {
      console.log("proxying to new pages site: ", url);
      return fetch(url.toString(), request);
    }
    console.log("No site found for: ", url);

    return env.ASSETS.fetch(request);
  },
};

const PATHS = {
  zilla: "zilla",
  mskProxies: "msk-proxies",
};

const SITES = {
  [PATHS.zilla]: "zilla-docs.pages.dev",
  [PATHS.mskProxies]: "msk-proxies-docs.pages.dev",
};

export default {
  async fetch(request, env) {
    const url = new URL(request.url);
    const origin = url.hostname;

    // Check if incoming hostname is a key in the SITES object
    if (url.pathname.startsWith(`/${PATHS.zilla}/`) || url.pathname === `/${PATHS.zilla}`) {
      console.log(`found: /${PATHS.zilla}/`);
      const target = SITES[PATHS.zilla];
      url.hostname = target;
    }
    
    if (url.pathname.startsWith(`/${PATHS.mskProxies}/`) || url.pathname === `/${PATHS.mskProxies}`) {
      console.log(`found: /${PATHS.mskProxies}/`);
      const target = SITES[PATHS.mskProxies];
      url.hostname = target;
    }
    
    if (url.hostname != origin) {
      console.log("proxying to new pages site: ", url);
      return fetch(url.toString(), request);
    }
    console.log("No site found for: ", url);

    return env.ASSETS.fetch(request);
  },
};

Setup docs site in Subdirectory of Existing Static Website

Similar Threads

Similar Threads

Similar Threads