[🐞] No platform specific headers in `request.headers`

[wanjohiryan]

Which component is affected?

Qwik City (routing)

Describe the bug

Hey there 👋🏾

I am trying to get platform specific headers like CF-* or on Vercel-* headers where i can get the location or region of the request, so far without success.

Here is a sample code using routeLoader, i have tried using onGet too.

export const useCloudflare = routeLoader$(async (req) => {
    const allHeaders: { [key: string]: string } = {}
    // for (const [key, value] of req.params) {
    //     params[key] = value
    // }
    for (const [key, value] of req.headers.entries()) {
        console.log("header", key, value)
    }
    // console.log("allHeaders", allHeaders)
    // console.log("req.platform", req.platform)
    // console.log("req.locale", req.locale())
    return null
    // return { allHeaders, locale:req.locale(), platform:req.platform }
})

I have tried this on Vercel, and now on Cloudflare Workers. I get no CF-* or Vercel-* specific headers.

Is there something am missing?

Thanks in advance.

Reproduction

none

Steps to reproduce

N/A

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (2) x64 Intel(R) Core(TM) i5-8250U CPU @ 1.60GHz
    Memory: 2.94 GB / 5.79 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.14.0 - ~/.nvm/versions/node/v20.14.0/bin/node
    npm: 10.7.0 - ~/.nvm/versions/node/v20.14.0/bin/npm
    pnpm: 9.4.0 - ~/.local/share/pnpm/pnpm
    bun: 1.1.18 - ~/.bun/bin/bun
  npmPackages:
    @builder.io/partytown: ^0.8.1 => 0.8.2
    @builder.io/qwik: ^1.5.7 => 1.5.7
    @builder.io/qwik-city: ^1.5.7 => 1.5.7
    @builder.io/qwik-react: 0.5.0 => 0.5.0
    typescript: 5.4.5 => 5.4.5
    undici: * => 6.19.2
    vite: ^5.2.10 => 5.3.2

Additional Information

I feel like I am missing something 😅

[wmertens]

we don't filter any headers, the request object is the one that came in. Very odd.

[wanjohiryan]

Thank you @wmertens for the prompt response.

How can I fix this?

Is there a way to get the headers? Like a hacky workaround?

I am open to anything

[wanjohiryan]

I got it to work 🥳

After looking at the code for how the QwikCity adapter for Cloudflare works i wrote this piece of code:

export const onGet: RequestHandler<PlatformCloudflarePages> = ({ headers,platform, json, clientConn}) => {
    const hed = new Map(platform.request.headers)
    console.log("platform headers", Object.fromEntries(hed))
    //@ts-ignore
    console.log("cf", platform.request.cf)

    const t = new Map(headers)
    const me = Object.fromEntries(t)
    console.log("headers", me)

    throw json(200,{
        IP: clientConn.ip,
        Country: clientConn.country,
    })  
}

Issues that might need to be fixed:

1. There is no Typescript support for the platform.cf object
2. The platform.request.headers won't work unless first passed into a Map, here is a simple web worker to play around with

PS: I have not tested this on Vercel, but i believe it should work the same? I dunno

[wmertens]

@wanjohiryan thanks for investigating and finding the fix, a PR for the types would always be appreciated 👍