or a way I can set a worker I have to be local, and have the pages function access that?

LLambo or a way I can set a worker I have to be local, and have the pages function acce...

H

Maybe adapting https://www.npmjs.com/package/cf-bindings-proxy to use Workers instead of Pages?

npm

Experimental proxy for interfacing with bindings in projects targeting Cloudflare Pages. Latest version: 0.7.1, last published: 4 months ago. Start using cf-bindings-proxy in your project by running

npm i cf-bindings-proxy

npm i cf-bindings-proxy

npm i cf-bindings-proxy

npm i cf-bindings-proxy. There are no other projects in the npm registry using cf-bindings-proxy.

L

LamboOP•3/11/24, 11:51 AM

I'll investigate. Thanks

L

LamboOP•3/11/24, 11:52 AM

Is non-local mode for pages dev planned?

LLambo Is non-local mode for pages dev planned?

H

Hello, I’m Allie!•3/11/24, 11:52 AM

Haven't heard about it, maybe with Convergence(merging of Workers/Pages)?

L

LamboOP•3/11/24, 11:52 AM

I'm not aware of Convergence

LLambo I'm not aware of Convergence

H

Hello, I’m Allie!•3/11/24, 11:53 AM

It's not active, but when it is, Pages and Workers will become a single product

L

LamboOP•3/11/24, 11:53 AM

That makes sense

L

LamboOP•3/11/24, 11:53 AM

Thanks!

L

LamboOP•3/11/24, 2:48 PM

Hey, me again...

So I have a Pages Function in the root of my functions directory called

[articleId].ts

[articleId].ts

[articleId].ts

[articleId].ts. A catch all for all

domain.com/<id>

domain.com/<id>

domain.com/<id>

domain.com/<id>.
This is great, however, it also catches

domain.com

domain.com

itself. Which I do not want, as it will trigger the function for no reason.

I thought I could disable this via

_routes.json

_routes.json

_routes.json

_routes.json:

{
  "version": "1",
  "include": ["/*"],
  "exclude": "/"
}

{
  "version": "1",
  "include": ["/*"],
  "exclude": "/"
}

{
  "version": "1",
  "include": ["/*"],
  "exclude": "/"
}

{
  "version": "1",
  "include": ["/*"],
  "exclude": "/"
}

L

LamboOP•3/11/24, 2:48 PM

However, this appears to do nothing. I still see the function being hit. Any ideas?

K

King•3/12/24, 1:18 AM

Hello guys, I need some help to define a way to handle file uploads to a quote form in a pages website and sent e-mail notifications with the files attached to them.

LLambo Hey, me again... So I have a Pages Function in the root of my functions directo...

M

Marius Gundersen•3/12/24, 6:29 AM

It might be related to this: https://github.com/cloudflare/workers-sdk/issues/3406

GitHub

🐛 BUG: Index route is overwritten by wildcard route · Issue #3406 ·...

Which Cloudflare product(s) does this pertain to? Wrangler What version of Wrangler are you using? 3.0.1 What operating system are you using? Windows Describe the Bug The pages functions routing ru...

MMarius Gundersen It might be related to this: https://github.com/cloudflare/workers-sdk/issues/34...

L

LamboOP•3/12/24, 10:18 AM

Seems so. Annoying no one has responded to it! How are you dealing with it?

LLambo Seems so. Annoying no one has responded to it! How are you dealing with it?

M

Marius Gundersen•3/12/24, 10:54 AM

For me the problem was that I couldn't have separate functions for index and fallback at the root level, but the simple workaround was to combine the functions and check the incoming url

L

LamboOP•3/12/24, 11:03 AM

Right okay sure

N

Nicolas•3/15/24, 3:19 PM

Hi all,

I was wondering what the recommended approach is for ingesting and processing form data, when deploying to cloudflare pages. Cloudflare pages supports the ideas of functions by adding a

/functions

/functions

/functions

/functions directory and placing scripts there: https://developers.cloudflare.com/pages/functions/get-started/, however I also noticed that Astro has this guide on endpoints: https://docs.astro.build/en/guides/endpoints/, and it seems this could also work? However, when using Cloudflare Pages for deployment, I am not sure which method is recommended. If i follow Astro's guide on endpoints, would these automatically be served by Pages in a similar way to the Functions? Anyone with experience with deploying Astro to Cloudflare Pages can shine some light on this?

Thank you!

NNicolas Hi all, I was wondering what the recommended approach is for ingesting and proc...

B

Beny•3/18/24, 3:58 PM

There's a plugin which is good for processing forms using a middleware function: https://developers.cloudflare.com/pages/functions/plugins/static-forms/
However if you're using Astro I assume you'll want to use their middleware instead.

Here's an example:

// src/middleware.js
export async function onRequest({ request, locals }, next) {
    // Check if the current request path matches the specific form action path
    if (new URL(request.url).pathname === '/form-path' && request.method === 'POST') {
        try {
            // Process form data
            const formData = await request.formData();

            // Example of form data processing.
            if(formData.get('name') !== "john") {
                throw new Error("Name must be john!")
            }

            // After processing successfully, redirect to `/form-submitted`
            return Response.redirect(new URL("/form-submitted", request.url), 302);
        } catch (error) {
            // If there's an error in processing, set `locals.formError`
            // This can later be checked in the endpoint handling the form submission
            locals.formError = error.message;
        }
    }

    // If the path does not match, proceed with the normal request flow.
    return next();
}

// src/middleware.js
export async function onRequest({ request, locals }, next) {
    // Check if the current request path matches the specific form action path
    if (new URL(request.url).pathname === '/form-path' && request.method === 'POST') {
        try {
            // Process form data
            const formData = await request.formData();

            // Example of form data processing.
            if(formData.get('name') !== "john") {
                throw new Error("Name must be john!")
            }

            // After processing successfully, redirect to `/form-submitted`
            return Response.redirect(new URL("/form-submitted", request.url), 302);
        } catch (error) {
            // If there's an error in processing, set `locals.formError`
            // This can later be checked in the endpoint handling the form submission
            locals.formError = error.message;
        }
    }

    // If the path does not match, proceed with the normal request flow.
    return next();
}

// src/middleware.js
export async function onRequest({ request, locals }, next) {
    // Check if the current request path matches the specific form action path
    if (new URL(request.url).pathname === '/form-path' && request.method === 'POST') {
        try {
            // Process form data
            const formData = await request.formData();

            // Example of form data processing.
            if(formData.get('name') !== "john") {
                throw new Error("Name must be john!")
            }

            // After processing successfully, redirect to `/form-submitted`
            return Response.redirect(new URL("/form-submitted", request.url), 302);
        } catch (error) {
            // If there's an error in processing, set `locals.formError`
            // This can later be checked in the endpoint handling the form submission
            locals.formError = error.message;
        }
    }

    // If the path does not match, proceed with the normal request flow.
    return next();
}

// src/middleware.js
export async function onRequest({ request, locals }, next) {
    // Check if the current request path matches the specific form action path
    if (new URL(request.url).pathname === '/form-path' && request.method === 'POST') {
        try {
            // Process form data
            const formData = await request.formData();

            // Example of form data processing.
            if(formData.get('name') !== "john") {
                throw new Error("Name must be john!")
            }

            // After processing successfully, redirect to `/form-submitted`
            return Response.redirect(new URL("/form-submitted", request.url), 302);
        } catch (error) {
            // If there's an error in processing, set `locals.formError`
            // This can later be checked in the endpoint handling the form submission
            locals.formError = error.message;
        }
    }

    // If the path does not match, proceed with the normal request flow.
    return next();
}

Cloudflare Docs

Static Forms · Cloudflare Pages docs

The Static Forms Pages Plugin intercepts all form submissions made which have the data-static-form-name attribute set. This allows you to take action …

I

Isaac McFadyen•3/18/24, 5:17 PM

You shouldn't need to use Astro's middleware to do this though.

I

Isaac McFadyen•3/18/24, 5:18 PM

You should be able to use Endpoints, the middleware just adds complexity because you need to check the path yourself.

S

Smarter•3/18/24, 7:04 PM

I am using a Pages Function as a proxy to my backend API, to get it to work I had to install CF SSL Cert, and use SSL on my backend API host, I was unable to use regular http. However, I was wondering if I must also use port 443 for my backend API or if I can specify one and that will work? I figured I'd ask before I went through trying it out, since everything is technically working right now.

S

Smarter•3/19/24, 6:37 PM

I can't seem to provide a custom port for my backend, it fails with a 521 error code.

S

Smarter•3/19/24, 6:41 PM

But requests from the script to the standard 443 HTTPS port work fine.

S

Smarter•3/19/24, 6:41 PM

But I'm trying to deploy a dev copy as well at 8443 in my Preview enviorment.

S

Smarter•3/19/24, 6:47 PM

Documentation shows that 8443 is a supported port as well

(https://developers.cloudflare.com/fundamentals/reference/network-ports/)

S

Smarter•3/19/24, 6:54 PM

Oh... damn: https://developers.cloudflare.com/workers/platform/known-issues/#custom-ports

K

Kilisei•3/20/24, 12:35 PM

Hi i have a question regarding turnstile and mailchannels for my contact form im stuck and cant get my turnstile key to verify correctly is there an example i could look at and maybe find my mistake?

CChamp Has Pages Functions supported the Server-Sent Events web standard yet?

O

outsideurimagination•3/20/24, 12:57 PM

did you get server sent events working? for me the client gets disconnected right away and tries reconnecting constantly after. I've heard we may need to do something with durable objects or just resort to websockets. hard to find info out there

S

soy.david•3/20/24, 3:22 PM

How can I use TCP sockets in my SvleteKit project? I don't understand how to import it into the route .

D

D5•3/20/24, 8:03 PM

So I thought building a blog that fetches data from Appwrite and generates a static Cloudflare pages (SSR page generation with Astro)

The doubt is, from what I'm seeing, there's a limit to 10ms CPU time? Then as the code needs to fetch data form appwrite it will throw an instant timeout (as it will take probably more that 10ms to get some response)?

DD5 So I thought building a blog that fetches data from Appwrite and generates a sta...

H

Hello, I’m Allie!•3/20/24, 8:04 PM

CPU Time is time doing some kind of work. Even if AppWrite takes 10 seconds to return a response, that isn't counted

HHello, I’m Allie!CPU Time is time doing some kind of work. Even if AppWrite takes 10 seconds to r...

D

D5•3/20/24, 8:05 PM

Oh, fine. So I could generate then the page successfully, right?

DD5 Oh, fine. So I could generate then the page successfully, right?

H

Hello, I’m Allie!•3/20/24, 8:05 PM

You should be able to, assuming you aren't doing more than 10 ms. of work rendering the actual page

HHello, I’m Allie!You should be able to, assuming you aren't doing more than 10 ms. of work render...

D

D5•3/20/24, 8:06 PM

That's something I'm not sure about

DD5 That's something I'm not sure about 😬

H

Hello, I’m Allie!•3/20/24, 8:08 PM

Note with Paid-Plan Workers you can get up to 30s of CPU time

H

Hello, I’m Allie!•3/20/24, 8:08 PM

So 10ms isn't a hard limit there

D

D5•3/20/24, 8:11 PM

Ouch, astro takes about 100ms

D

D5•3/20/24, 8:11 PM

Then I will use some alternative

D

D5•3/20/24, 8:12 PM

Meanwhile the app scales

DD5 Ouch, astro takes about 100ms 😓

H

Hello, I’m Allie!•3/20/24, 8:12 PM

That seems extremely high. What are you doing, may I ask?

HHello, I’m Allie!That seems *extremely* high. What are you doing, may I ask?

D

D5•3/20/24, 8:36 PM

I didn't have tested it yet, but from what I've found that's what does it take

DD5 Ouch, astro takes about 100ms 😓

I

Isaac McFadyen•3/20/24, 8:54 PM

Are you sure you're not confusing CPU and wall time?

I

Isaac McFadyen•3/20/24, 8:54 PM

100ms sounds quite high indeed.

I

Isaac McFadyen•3/20/24, 8:54 PM

?cpu-time

F

Flare•3/20/24, 8:54 PM

CPU Time: the amount of work the CPU needs to do, measured in

ms

ms

ms

ms. More CPU-heavy things will increase it (hashing passwords). This is not the same as the time a

fetch

fetch

request takes - a request might take 10 seconds but only use 1ms of CPU Time.
Wall Time: the actual amount of time a Worker runs for, as though you measured it with a clock or your browser DevTools

Iits.jcw if i want to send metrics to datadog from a high volume function, does it make s...

H

Hello, I’m Allie!•3/23/24, 6:40 PM

It wouldn't really work. Current advice is assume that the global state is nuked for every request. It can be reused over multiple requests, but it definitely isn't behavior you should rely on

or a way I can set a worker I have to be local, and have the pages function access that?

Similar Threads

Similar Threads

Similar Threads