@HardlyWorkin' this works fine on workers: https://github.com/sutandojs/sutando-examples/tree/main/t

N

Nicolasmp•6/19/24, 1:43 PM

Hi there, I am using a NextJS based pages project using the GIT integration. I have a very simple worker (in functions folder, a hello world).For some reason on latest builds I do not see this worker being deployed anymore.

J

jjjrmyOP•6/19/24, 6:08 PM

@HardlyWorkin' are you able to look at deploy logs?

Jjjjrmy @HardlyWorkin' are you able to look at deploy logs?

H

Hard@Work•6/19/24, 6:44 PM

Sorry, was a bit busy, let me catch up with this thread...

Jjjjrmy @HardlyWorkin' this works fine on workers: https://github.com/sutandojs/sutando-...

H

Hard@Work•6/19/24, 6:51 PM

Ok, I see what might be the issue. It appears the project uses the

node_compat

node_compat

polyfill system, which isn't supported on Functions

HHard@Work Ok, I see what might be the issue. It appears the project uses the `node_compat`...

J

jjjrmyOP•6/19/24, 6:51 PM

it's not building with the wrangler file for Pages/Functions

Jjjjrmy it's not building with the wrangler file for Pages/Functions

H

Hard@Work•6/19/24, 6:52 PM

I'm not sure I understand what you are saying?

J

jjjrmyOP•6/19/24, 6:52 PM

I pinged you in the thread

T

TheKaiser•6/20/24, 11:26 PM

anyone have advice on debugging a 500 for my ssr app? finally got my first build to go through but I just get a 500 page, and since its ssr, all i get from going to the page is the 500 error page without any way to see what the actual error is. Also don't see anything on the functions metrics page

T

TheKaiser•6/20/24, 11:41 PM

nvm found the Real-time Logs section in the functions tab of my deployment

P

Phonebox•6/21/24, 3:04 AM

I’m seeing a p99 of 95ms and a p50 of 4.6ms on CPU time for functions after deploying the next js starter app to pages. What’s going on here? Why are these values so high?

Original message was deleted

H

Hard@Work•6/21/24, 11:31 AM

لطفاً طبق قوانین #

welcome-and-rules سؤال خود را در چندین کانال پست نکنید. برای افرادی که سعی در کمک به شما دارند سردرگمی ایجاد می کند و مشکل یا سوال شما را سریعتر حل نمی کند.

PPerry Sahnow When using a KV binding in a function in dev mode does it actually update the KV...

H

Hello, I’m Allie!•6/22/24, 7:20 AM

It updates a local version of your KV namespace in

.wrangler

.wrangler

B

bnason•6/24/24, 1:21 PM

I'm deploying a Nuxt app however it seems like an import from one of my dependencies is undefined. I'm importing

samlify

samlify

and it is importing some exports from

node-forge

node-forge

but those are undefined. I get

TypeError: Cannot read properties of undefined (reading 'decode64') at ....

TypeError: Cannot read properties of undefined (reading 'decode64') at ....

It works fine locally but I'm not sure how to debug what is going on when it's deployed to CloudFlare. Does anyone have any ideas?

B

bnason•6/24/24, 1:23 PM

Plus I'm not sure if this is a Functions question or a Workers question. I think it deploys functions but I'm new to this.

D

DaniFoldi•6/24/24, 1:27 PM

?channel-crossposting import is undefined

F

Flare•6/24/24, 1:27 PM

Please do not post your question in multiple channels per the rules at #

welcome-and-rules. It creates confusion for people trying to help you and doesn't get your issue or question solved any faster.

S

SonyC•6/24/24, 6:05 PM

Hello, I have set a Service bindings in my worker pages setting to be able to request from the statically web page(built with vite) I deployed in pages to a worker. My issue is that I don't know how to access the env variable from my static page code to get the env.SERVICE.fetch call(I tried using import.meta.env but that doesn't work). HELP.

SSonyC Hello, I have set a Service bindings in my worker pages setting to be able to re...

H

Hard@Work•6/25/24, 10:07 AM

You can't access bindings during build, if that is what you mean

HHard@Work You can't access bindings during build, if that is what you mean

S

SonyC•6/25/24, 11:04 AM

But how I'm supposed to access them from a static web page(I don't want to access them in development/local, I eman production once it is deployed), will the env variable be accessible? In a worker the context comes from the event onRequest but how from a worker page?

SSonyC But how I'm supposed to access them from a static web page(I don't want to acces...

H

Hard@Work•6/25/24, 12:45 PM

From a completely static page? You can't

H

Hard@Work•6/25/24, 12:45 PM

Bindings are available at runtime

S

SonyC•6/25/24, 12:57 PM

So I have a react static page, built with vite(rollup), I need to create a functions folder and listen to fetch events like this:

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

    if (url.pathname.startsWith('/api/')) {
      const apiRequest = new Request(
        `https://your-worker-url.com${url.pathname}`,
        request
      );
      return env.MY_WORKER_SERVICE.fetch(apiRequest);
    }

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

});

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

    if (url.pathname.startsWith('/api/')) {
      const apiRequest = new Request(
        `https://your-worker-url.com${url.pathname}`,
        request
      );
      return env.MY_WORKER_SERVICE.fetch(apiRequest);
    }

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

});

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

    if (url.pathname.startsWith('/api/')) {
      const apiRequest = new Request(
        `https://your-worker-url.com${url.pathname}`,
        request
      );
      return env.MY_WORKER_SERVICE.fetch(apiRequest);
    }

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

});

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

    if (url.pathname.startsWith('/api/')) {
      const apiRequest = new Request(
        `https://your-worker-url.com${url.pathname}`,
        request
      );
      return env.MY_WORKER_SERVICE.fetch(apiRequest);
    }

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

});

In this example, MY_WORKER_SERVICE is the name I gave to the service binding in the Cloudflare Pages dashboard.
using the SERVICE and in the static code just request to localhost/api.....?

SSonyC So I have a react static page, built with vite(rollup), I need to create a funct...

H

Hard@Work•6/25/24, 1:21 PM

You probably want this instead:

// functions/api/[[route]].ts
export const onRequest: PagesFunction = ({ request }) => {
  const url = new URL(request.url);
  url.host = "your-worker-url.com";
  return fetch(url.toString(), request);
};

// functions/api/[[route]].ts
export const onRequest: PagesFunction = ({ request }) => {
  const url = new URL(request.url);
  url.host = "your-worker-url.com";
  return fetch(url.toString(), request);
};

// functions/api/[[route]].ts
export const onRequest: PagesFunction = ({ request }) => {
  const url = new URL(request.url);
  url.host = "your-worker-url.com";
  return fetch(url.toString(), request);
};

// functions/api/[[route]].ts
export const onRequest: PagesFunction = ({ request }) => {
  const url = new URL(request.url);
  url.host = "your-worker-url.com";
  return fetch(url.toString(), request);
};

S

SonyC•6/25/24, 1:40 PM

so, a [route].ts file for each endpoint?

SSonyC so, a [route].ts file for each endpoint?

H

Hard@Work•6/25/24, 1:41 PM

No, the above should catch anything on

/api

/api

H

Hard@Work•6/25/24, 1:41 PM

https://developers.cloudflare.com/pages/functions/routing/#dynamic-route-examples

Cloudflare Docs

Routing · Cloudflare Pages docs

Functions utilize file-based routing. Your /functions directory structure determines the designated routes that your Functions will run on. You can …

S

SonyC•6/25/24, 1:41 PM

Thanks!

KKynson For anyone who encounters the same problem, it seems that page function does not...

D

Deo Kumar•6/29/24, 12:45 PM

try
https://www.npmjs.com/package/@cf-wasm/satori
https://www.npmjs.com/package/@cf-wasm/og

npm

@cf-wasm/satori

Enlightened library to convert HTML and CSS to SVG.. Latest version: 0.1.19, last published: a month ago. Start using @cf-wasm/satori in your project by running

npm i @cf-wasm/satori

npm i @cf-wasm/satori

. There is 1 other project in the npm registry using @cf-wasm/satori.

npm

@cf-wasm/og

Generate Open Graph Images dynamically from HTML/CSS without a browser.. Latest version: 0.1.27, last published: a day ago. Start using @cf-wasm/og in your project by running

npm i @cf-wasm/og

npm i @cf-wasm/og

. There are no other projects in the npm registry using @cf-wasm/og.

D

Deo Kumar•6/29/24, 12:46 PM

its just a wrapper, you dont need to manually initialize the yoga

import { satori } from "@cf-wasm/satori"; // <- for cf workers/pages
import { satori } from "@cf-wasm/satori/next"; // <- for next js edge

import { satori } from "@cf-wasm/satori"; // <- for cf workers/pages
import { satori } from "@cf-wasm/satori/next"; // <- for next js edge

S

surgery18•6/30/24, 4:13 AM

Is there any way to make the page functions use all remote resources instead of local? Like for D1, R2, DO, KV, Queues, etc? Thanks.

Ssurgery18 Is there any way to make the page functions use all remote resources instead of ...

H

Hello, I’m Allie!•6/30/24, 4:43 AM

Not for Pages

HHello, I’m Allie!Not for Pages

S

surgery18•6/30/24, 4:46 AM

Any plans on adding the ability to use remote resources?

Ssurgery18 Any plans on adding the ability to use remote resources?

H

Hello, I’m Allie!•6/30/24, 4:48 AM

Maybe when Workers and Pages get merged into a single product?

V

valkyrie_pilot•6/30/24, 4:51 AM

is that in the roadmap?

W

Walshy•6/30/24, 9:28 AM

Converging the products? Yes, it's in active development

S

scruffy•7/1/24, 4:18 PM

Just ran into an issue where adding

wrangler.toml

wrangler.toml

and running a

wrangler pages dev

wrangler pages dev

command results in a hanging browser. Raised it on GitHub (https://github.com/cloudflare/workers-sdk/issues/6173), then noticed the message on https://developers.cloudflare.com/pages/functions/wrangler-configuration/ that said to come here... does anyone know if this is expected behaviour or am I doing something wrong?

GitHub

Issues · cloudflare/workers-sdk

Home to Wrangler, the CLI for Cloudflare Workers® - Issues · cloudflare/workers-sdk

Cloudflare Docs

Configuration · Cloudflare Pages docs

If your project contains an existing wrangler.toml file that you previously used for local development, make sure you verify that it matches your …

Sscruffy Just ran into an issue where adding `wrangler.toml` and running a `wrangler page...

H

Hard@Work•7/2/24, 9:11 AM

Does it work if you place

index.html

index.html

in a directory, then run

wrangler pages dev <directory>

wrangler pages dev <directory>

?

HHard@Work Does it work if you place `index.html` in a directory, then run `wrangler pages ...

S

scruffy•7/2/24, 9:21 AM

i'm out at the moment, will check once i'm back in a few hours. thanks for the suggestion

HHard@Work Does it work if you place `index.html` in a directory, then run `wrangler pages ...

S

scruffy•7/2/24, 12:01 PM

Just went and checked... was about to say that problem remained when using a sub-directory when I fumbled switching apps and landed in my browser and saw the correct content... it appears that the issue (whether content is at root or in a subdirectory) is that it takes time for wrangler to get itself into a position where it can respond (on my machine that seems to often take 11 or 12ish seconds). At that point, I get the following in the console (which seems to be the same time when the browser returns content):

S

scruffy•7/2/24, 12:01 PM

✘ [ERROR] Failed to register worker in local service registry TypeError: fetch failed

      at fetch
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:17209:19)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async registerWorker
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:203827:12)
      at async Object.announceAndOnReady [as onReady]
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:206237:7)
  {
    cause: ConnectTimeoutError: Connect Timeout Error
        at onConnectTimeout
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6031:29)
        at
  /Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:5987:51
        at Immediate._onImmediate
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6019:13)
        at process.processImmediate (node:internal/timers:478:21)
        at process.topLevelDomainCallback (node:domain:160:15)
        at process.callbackTrampoline (node:internal/async_hooks:128:24) {
      code: 'UND_ERR_CONNECT_TIMEOUT'
    }
  }


[wrangler:inf] GET / 200 OK (5989ms)

✘ [ERROR] Failed to register worker in local service registry TypeError: fetch failed

      at fetch
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:17209:19)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async registerWorker
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:203827:12)
      at async Object.announceAndOnReady [as onReady]
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:206237:7)
  {
    cause: ConnectTimeoutError: Connect Timeout Error
        at onConnectTimeout
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6031:29)
        at
  /Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:5987:51
        at Immediate._onImmediate
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6019:13)
        at process.processImmediate (node:internal/timers:478:21)
        at process.topLevelDomainCallback (node:domain:160:15)
        at process.callbackTrampoline (node:internal/async_hooks:128:24) {
      code: 'UND_ERR_CONNECT_TIMEOUT'
    }
  }


[wrangler:inf] GET / 200 OK (5989ms)

✘ [ERROR] Failed to register worker in local service registry TypeError: fetch failed

      at fetch
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:17209:19)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async registerWorker
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:203827:12)
      at async Object.announceAndOnReady [as onReady]
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:206237:7)
  {
    cause: ConnectTimeoutError: Connect Timeout Error
        at onConnectTimeout
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6031:29)
        at
  /Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:5987:51
        at Immediate._onImmediate
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6019:13)
        at process.processImmediate (node:internal/timers:478:21)
        at process.topLevelDomainCallback (node:domain:160:15)
        at process.callbackTrampoline (node:internal/async_hooks:128:24) {
      code: 'UND_ERR_CONNECT_TIMEOUT'
    }
  }


[wrangler:inf] GET / 200 OK (5989ms)

✘ [ERROR] Failed to register worker in local service registry TypeError: fetch failed

      at fetch
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:17209:19)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async registerWorker
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:203827:12)
      at async Object.announceAndOnReady [as onReady]
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:206237:7)
  {
    cause: ConnectTimeoutError: Connect Timeout Error
        at onConnectTimeout
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6031:29)
        at
  /Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:5987:51
        at Immediate._onImmediate
  (/Users/andy/=/quests/delete-me-pages/node_modules/.pnpm/wrangler@3.62.0/node_modules/wrangler/wrangler-dist/cli.js:6019:13)
        at process.processImmediate (node:internal/timers:478:21)
        at process.topLevelDomainCallback (node:domain:160:15)
        at process.callbackTrampoline (node:internal/async_hooks:128:24) {
      code: 'UND_ERR_CONNECT_TIMEOUT'
    }
  }


[wrangler:inf] GET / 200 OK (5989ms)

S

scruffy•7/2/24, 12:02 PM

in this instance, it looks like it was relatively quick, just under six seconds

MMarcel Overdijk I was wondering if `_routes.json` (https://developers.cloudflare.com/pages/funct...

C

Chinoman10•7/2/24, 9:48 PM

wth is 'Advanced mode'? Lol

Edit: Found the docs for it.

In advanced mode, your Function will assume full control of all incoming HTTP requests to your domain. Your Function is required to make or forward requests to your project’s static assets. Failure to do so will result in broken or unwanted behavior. Your Function must be written in Module syntax.

Well, there goes my curiosity out the window :wave_animated:

@HardlyWorkin' this works fine on workers: https://github.com/sutandojs/sutando-examples/tree/main/t

Similar Threads

Similar Threads

Similar Threads