Does this mean that Wasm with Base64-encoded Data URLs does not work with Cloudflare Pages?

くくもりにくもったクラウドサービスlocaler Does this mean that Wasm with Base64-encoded Data URLs does not work with Cloudf...

I

Correct, any dynamic code (code that is compiled or constructed during runtime) is disallowed on Cloudflare Workers and Cloudflare Pages for security reasons

I

Isaac McFadyen•4/1/25, 12:58 PM

https://developers.cloudflare.com/workers/runtime-apis/web-standards/#javascript-standards

I

Isaac McFadyen•4/1/25, 1:01 PM

If you're interested there's a good talk on the security model of Workers from the engineering lead on the Workers team: https://www.infoq.com/presentations/cloudflare-v8/

LLemon hey, did anyone tried to display `CF_PAGES_COMMIT_SHA` within a Vite React proje...

L

Lemon•4/1/25, 4:07 PM

if any other peep bashing their head with this trash documentation here is the solution

edit your

vite.config.ts

vite.config.ts

like so (or add these lines)

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],
  define: {
    "import.meta.env.CF_PAGES": JSON.stringify(process.env.CF_PAGES || "1"),
    "import.meta.env.CF_PAGES_URL": JSON.stringify(process.env.CF_PAGES_URL || "unresolved"),
    "import.meta.env.CF_PAGES_BRANCH": JSON.stringify(process.env.CF_PAGES_BRANCH || "unresolved"),
    "import.meta.env.CF_PAGES_COMMIT_SHA": JSON.stringify(process.env.CF_PAGES_COMMIT_SHA || "unknown"),
  },
})

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],
  define: {
    "import.meta.env.CF_PAGES": JSON.stringify(process.env.CF_PAGES || "1"),
    "import.meta.env.CF_PAGES_URL": JSON.stringify(process.env.CF_PAGES_URL || "unresolved"),
    "import.meta.env.CF_PAGES_BRANCH": JSON.stringify(process.env.CF_PAGES_BRANCH || "unresolved"),
    "import.meta.env.CF_PAGES_COMMIT_SHA": JSON.stringify(process.env.CF_PAGES_COMMIT_SHA || "unknown"),
  },
})

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],
  define: {
    "import.meta.env.CF_PAGES": JSON.stringify(process.env.CF_PAGES || "1"),
    "import.meta.env.CF_PAGES_URL": JSON.stringify(process.env.CF_PAGES_URL || "unresolved"),
    "import.meta.env.CF_PAGES_BRANCH": JSON.stringify(process.env.CF_PAGES_BRANCH || "unresolved"),
    "import.meta.env.CF_PAGES_COMMIT_SHA": JSON.stringify(process.env.CF_PAGES_COMMIT_SHA || "unknown"),
  },
})

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],
  define: {
    "import.meta.env.CF_PAGES": JSON.stringify(process.env.CF_PAGES || "1"),
    "import.meta.env.CF_PAGES_URL": JSON.stringify(process.env.CF_PAGES_URL || "unresolved"),
    "import.meta.env.CF_PAGES_BRANCH": JSON.stringify(process.env.CF_PAGES_BRANCH || "unresolved"),
    "import.meta.env.CF_PAGES_COMMIT_SHA": JSON.stringify(process.env.CF_PAGES_COMMIT_SHA || "unknown"),
  },
})

C

crossbeau•4/1/25, 4:08 PM

if I were to create say 3 pages projects:
my-app-dev=====\
my-app-stage========== single-project-repo. (dev branch, stage branch, main branch)
my-app-prod ===/

how could I handle indepedent variables for each with a single wrangler file? can I have global values for all and then manually set values for each using api ? or would api settings overwrite values set by wrangler ?

C

crossbeau•4/1/25, 4:08 PM

I know I can do this with workers, but just unsure of how to handle this for pages

LLemon if any other peep bashing their head with this trash documentation here is the s...

I

Isaac McFadyen•4/1/25, 4:09 PM

Per Vite docs, only variables prefixed with

VITE_

VITE_

will be exposed to the build without that config change, yes https://vite.dev/guide/env-and-mode.html#env-variables

IIsaac McFadyen Per Vite docs, only variables prefixed with `VITE_` will be exposed to the build...

L

Lemon•4/1/25, 4:13 PM

Nah bro I agree to disagree It took me 3 hours to debug this.
You have to put these variables into your config without this the import.meta.env wont see the Cloudflare injected variables and noone talks about this.
Without the config.ts there is nothing CF related in the import.meta.env https://38625370.trash-vars.pages.dev/
With the config.ts CF populates and injects the variables as should be by default https://2d4b43b9.trash-vars.pages.dev/

LLemon Nah bro I agree to disagree It took me 3 hours to debug this. You have to put th...

I

Isaac McFadyen•4/1/25, 4:14 PM

Yes I understand that, but that's because Vite only puts variables that start with the

VITE_

VITE_

prefix into import.meta.env, which is why that config change is required

I

Isaac McFadyen•4/1/25, 4:15 PM

CF_PAGES_COMMIT_SHA

CF_PAGES_COMMIT_SHA

CF_PAGES_COMMIT_SHA

CF_PAGES_COMMIT_SHA doesn't start with

VITE_

VITE_

and so Vite hides it because it assumes you don't want to expose it to client code

L

Lemon•4/1/25, 4:16 PM

Yeah I get it, but it would be nice to put these comments/precautions in to the CF docs (https://developers.cloudflare.com/pages/framework-guides/deploy-a-vite3-project/)
Could you push stuff like this to the CF team?

Cloudflare Docs

Vite 3 · Cloudflare Pages docs

Vite is a next-generation build tool for front-end developers. With the release of Vite 3, developers can make use of new command line (CLI) improvements, starter templates, and more to help build their front-end applications.

R

rad•4/1/25, 4:21 PM

are there any customer success stories of CloudFlare Workers to help shill CF?

Rrad are there any customer success stories of CloudFlare Workers to help shill CF?

I

Isaac McFadyen•4/1/25, 4:24 PM

A lot, but some aren't really public.

Vercel uses Workers for their edge runtime
Shopify uses Cloudflare, and presumably Workers but not publicly confirmed
civit.ai uses R2 and Workers for all file downloads
Nodecraft uses Workers for some of their APIs
And https://workers.cloudflare.com has logos of a bunch of companies (i.e. Discord, NPM, maxmind) but no details on how they actually use Workers.

Cloudflare Workers©

Build your next application with Cloudflare Workers

Rrad are there any customer success stories of CloudFlare Workers to help shill CF?

C

Cyb3r-Jak3•4/1/25, 4:25 PM

You can also look through case studies to see what matches best: https://www.cloudflare.com/case-studies/

Cloudflare Case Studies

Cloudflare customer case studies provide cyber security testimonials and customer use cases for a suite of website security and performance products.

Ccrossbeau if I were to create say 3 pages projects: my-app-dev=====\ my-app-stage=========...

C

crossbeau•4/1/25, 4:32 PM

like. how could I use a single wrangler.toml as a source of truth for 3 environments but also allow deviation for different environments where needed ?

C

crossbeau•4/1/25, 4:32 PM

do I just abuse secrets and individually add non-secrets as secrets at the project level?

O

Ostof•4/1/25, 4:46 PM

Hello, not sure if this is the right channel for this question. I have a astro pages project which is already deployed and wanted to add a durable object as a websocket server but have not found a way to do this.
Now I have converted to workers framework beta (https://developers.cloudflare.com/workers/frameworks/framework-guides/astro/) but cant get it working.

Maybe naively I have just created a simple DO class and added it to the config.json.

Is there a recommended way to add a durable objects to a pages or workers framework project add test it locally.

Cloudflare Docs

Astro · Cloudflare Workers docs

Create an Astro application and deploy it to Cloudflare Workers with Workers Assets.

C

crossbeau•4/1/25, 5:01 PM

is there a way using the API to create a Cloudflare Worker Associated to Github/Gitlab ?

HHereToHelp I've been using Cloudflare to set up a url-accessible web build of a game I cont...

D

dave•4/1/25, 5:24 PM

How big are the files? I wonder if Static Assets would be a better fit.

https://developers.cloudflare.com/workers/static-assets/

D

dave•4/1/25, 5:29 PM

Is there any trick I could do to make a Cron Worker trigger another Worker that is a domain zone (so caching works)?

M

manterfield•4/1/25, 5:35 PM

Heyo

. Is the Cache API secure in terms of storing content under signed URLs? That is a user makes a request to us with a signature in the URL that we verify (time restricted), we cache that for a bit.

The URL is unguessable, so effectively I'm asking if Cloudflare exposes a method that someone could enumerate or otherwise discover URLs that are cached?

Mmanterfield Heyo 👋 . Is the Cache API secure in terms of storing content under signed URLs?...

D

dave•4/1/25, 6:09 PM

If you accidentally config a cache rule to ignore search params, that could be a problem.

Ddave How big are the files? I wonder if Static Assets would be a better fit. https:/...

H

HereToHelp•4/1/25, 7:15 PM

I did try that, but yeah they're too big for just workers/pages unfortunately

M

matt•4/1/25, 7:36 PM

Did this ever go live? https://blog.cloudflare.com/data-anywhere-events-pipelines-durable-execution-workflows/

The Cloudflare Blog

Data Anywhere with Pipelines, Event Notifications, and Workflows

We’re making it easier to build scalable, reliable, data-driven applications on top of our global network, and so we’re announcing a new Event Notifications framework; our take on durable execution, Workflows; and an upcoming streaming ingestion service, Pipelines

Mmatt Did this ever go live? https://blog.cloudflare.com/data-anywhere-events-pipeline...

D

dave•4/1/25, 8:55 PM

See #workflows-beta

D

dave•4/1/25, 8:56 PM

I personally decided not to use Workflows. I found it much easier to have a Cron Worker poll a PostgreSQL database (through Hyperdrive).

H

HereToHelp•4/1/25, 10:50 PM

f02f6632 is the most recent deployment, made Apr 1 00:30 UTC. It's the one listed under "Active Deployment". For some reason though, it look like 84efc01c is still serving requests? Am I misreading this, or is there an outdated version of my worker's code still active? Do I need to do something to make sure all requests are handled by the latest version?

H

HereToHelp•4/1/25, 10:55 PM

I tried clicking "Deploy version" under "Active deployment", sending a new request, and re-checking, and the graph changed? Was it just a visual bug?

H

HereToHelp•4/1/25, 10:59 PM

It keeps randomly changing between the two versions of the chart when I refresh. I am very confused lol

HHereToHelp It keeps randomly changing between the two versions of the chart when I refresh....

P

Peps•4/2/25, 1:02 AM

yeah the new worker metrics are still a little bit buggy so it tends to do that

P

Peps•4/2/25, 1:02 AM

it's being worked on though

H

HereToHelp•4/2/25, 1:02 AM

Got it — thanks for the answer

Original message was deleted

C

crossbeau•4/2/25, 2:05 AM

Use .env.vars for testing local and gitignore that file. And use

wrangler secrets put

wrangler secrets put

wrangler secrets put

wrangler secrets put to put on deployed app

S

Soorya•4/2/25, 3:27 AM

Hey, is it required for me to update the durable object version everytime I need to deploy the project? Because I am currently getting an error

Cannot apply new-class migration to class 'DurableObject' that is already depended on by existing Durable Objects [code: 10074]

Cannot apply new-class migration to class 'DurableObject' that is already depended on by existing Durable Objects [code: 10074]

Cannot apply new-class migration to class 'DurableObject' that is already depended on by existing Durable Objects [code: 10074]

Cannot apply new-class migration to class 'DurableObject' that is already depended on by existing Durable Objects [code: 10074]

, As per chatgpt it might be because I need to update the

v

v in the workers. Does anyone have any idea and do I need to update the version everytime?

Original message was deleted

M

manterfield•4/2/25, 9:51 AM

For what I'm doing the signature in the URL is quite important. Cache outliving the expiry isn't necessarily a problem (assuming it will be removed within a 'reasonable' time post expiry - i.e. it won't live for days or weeks past). The payload under the URL isn't super sensitive, this is more a redundant protection for defence in depth. It would only be a problem if an external user could easily see all the URLs without knowing them in advance/without brute forcing.

Good thought about WAF in front of cache though - I don't think it will work for what I want, but will sanity check. Thanks!

Original message was deleted

C

crossbeau•4/2/25, 10:35 AM

So if you put secrets in my secrets put and you have non secret env vars in the toml it leaves the secrets untouched until you run that command again

Original message was deleted

C

crossbeau•4/2/25, 11:13 AM

Use terraform to create your worker or pages project and use it to configure and setup env vars and secrets. And then only use wrangler to deploy code

Ccrossbeau Use terraform to create your worker or pages project and use it to configure and...

C

crossbeau•4/2/25, 11:14 AM

Just for workers on the toml
Make sure to set keep_vars - https://developers.cloudflare.com/workers/wrangler/configuration/#top-level-only-keys

Cloudflare Docs

Configuration - Wrangler · Cloudflare Workers docs

Use a configuration file to customize the development and deployment setup for your Worker project and other Developer Platform products.

C

crossbeau•4/2/25, 12:03 PM

@oSumAtrIX may i dm you ?

D

dave•4/2/25, 3:23 PM

function encodeBase64Bytes(bytes: Uint8Array): string {
  return btoa(
    bytes.reduce((acc, current) => acc + String.fromCharCode(current), "")
  );
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  return btoa(
    bytes.reduce((acc, current) => acc + String.fromCharCode(current), "")
  );
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  return btoa(
    bytes.reduce((acc, current) => acc + String.fromCharCode(current), "")
  );
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  return btoa(
    bytes.reduce((acc, current) => acc + String.fromCharCode(current), "")
  );
}

Is there a better/more performant way of converting an ArrayBuffer to a base64 string in a Worker?

S

Spuckwaffel•4/2/25, 4:38 PM

hey uh is it normal that when purchasing a domain and setting up pages i get the mesage "The hostname is part of a banned domain. This web property cannot be added to Cloudflare at this time"

?

S

Spuckwaffel•4/2/25, 4:38 PM

i never had this

S

sharax•4/2/25, 4:41 PM

{
"code": 10021,
"message": "Uncaught SyntaxError: Unexpected token 'export'\n  at worker.js:474\n"
}

{
"code": 10021,
"message": "Uncaught SyntaxError: Unexpected token 'export'\n  at worker.js:474\n"
}

{
"code": 10021,
"message": "Uncaught SyntaxError: Unexpected token 'export'\n  at worker.js:474\n"
}

{
"code": 10021,
"message": "Uncaught SyntaxError: Unexpected token 'export'\n  at worker.js:474\n"
}

This error is driving me crazy.
I can manually add the code to a worker through the Cloudflare control panel, but I can't do it via the API.
What's the real issue?
I took the exact same JS file from an active worker.

curl "https://api.cloudflare.com/client/v4/accounts/{acount}/workers/scripts/{worker}" \
    -X PUT \
    -H "Authorization: Bearer {token}" \
    -H "Content-Type: multipart/form-data" \
    --form "script=@worker.js;type=application/javascript" \
    --form "metadata={\"main_module\": \"worker.js\", \"compatibility_date\": \"2025-04-02\", \"compatibility_flags\": [\"nodejs_compat\"]};type=application/json"

curl "https://api.cloudflare.com/client/v4/accounts/{acount}/workers/scripts/{worker}" \
    -X PUT \
    -H "Authorization: Bearer {token}" \
    -H "Content-Type: multipart/form-data" \
    --form "script=@worker.js;type=application/javascript" \
    --form "metadata={\"main_module\": \"worker.js\", \"compatibility_date\": \"2025-04-02\", \"compatibility_flags\": [\"nodejs_compat\"]};type=application/json"

curl "https://api.cloudflare.com/client/v4/accounts/{acount}/workers/scripts/{worker}" \
    -X PUT \
    -H "Authorization: Bearer {token}" \
    -H "Content-Type: multipart/form-data" \
    --form "script=@worker.js;type=application/javascript" \
    --form "metadata={\"main_module\": \"worker.js\", \"compatibility_date\": \"2025-04-02\", \"compatibility_flags\": [\"nodejs_compat\"]};type=application/json"

curl "https://api.cloudflare.com/client/v4/accounts/{acount}/workers/scripts/{worker}" \
    -X PUT \
    -H "Authorization: Bearer {token}" \
    -H "Content-Type: multipart/form-data" \
    --form "script=@worker.js;type=application/javascript" \
    --form "metadata={\"main_module\": \"worker.js\", \"compatibility_date\": \"2025-04-02\", \"compatibility_flags\": [\"nodejs_compat\"]};type=application/json"

Original message was deleted

D

dave•4/2/25, 5:17 PM

Oh, what about this though?

function encodeBase64Bytes(bytes: Uint8Array): string {
  const decoder = new TextDecoder('latin1');
  const text = decoder.decode(bytes);
  return btoa(text);
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  const decoder = new TextDecoder('latin1');
  const text = decoder.decode(bytes);
  return btoa(text);
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  const decoder = new TextDecoder('latin1');
  const text = decoder.decode(bytes);
  return btoa(text);
}

function encodeBase64Bytes(bytes: Uint8Array): string {
  const decoder = new TextDecoder('latin1');
  const text = decoder.decode(bytes);
  return btoa(text);
}

Original message was deleted

D

dave•4/2/25, 5:45 PM

hmm, seems like it would be better to stick with TextDecoder though since it's native?

D

dave•4/2/25, 5:45 PM

https://developers.cloudflare.com/workers/examples/cache-using-fetch/#using-the-http-cache-api

For some reason when I try to use the new

cache

cache

cache

cache parameter, VS Code complains about this:

Object literal may only specify known properties, and 'cache' does not exist in type 'RequestInit<RequestInitCfProperties>'.ts(2353)

Object literal may only specify known properties, and 'cache' does not exist in type 'RequestInit<RequestInitCfProperties>'.ts(2353)

Object literal may only specify known properties, and 'cache' does not exist in type 'RequestInit<RequestInitCfProperties>'.ts(2353)

Object literal may only specify known properties, and 'cache' does not exist in type 'RequestInit<RequestInitCfProperties>'.ts(2353)

D

dave•4/2/25, 5:46 PM

unrelated questions

D

dave•4/2/25, 5:46 PM

sorry

Does this mean that Wasm with Base64-encoded Data URLs does not work with Cloudflare Pages?

Similar Threads

Similar Threads

Similar Threads