Hi all, is it possible to deploy your Nuxt 3 app (with server directory, so the official back-end im

Nnico Hi all, is it possible to deploy your Nuxt 3 app (with server directory, so the ...

C

Cyb3r-Jak3•8/25/23, 3:41 PM

Some frameworks have ability to generate functions for Pages so you can use the server side of them

C

Canopy•8/25/23, 5:05 PM

Is there any reason you couldn't create a serverless email server using cloudflare pages and D1? I'm trying to see if there'd be a technical limitation anywhere or a policy limiting you from doing it but I can't find anything from my brief search since thinking about the idea.

CCanopy Is there any reason you couldn't create a serverless email server using cloudfla...

C

Cyb3r-Jak3•8/25/23, 5:20 PM

Define serverless email? You’d need a worker with an email trigger and a different service to send emails but it should technically be possible

CCyb3r-Jak3 Define serverless email? You’d need a worker with an email trigger and a differe...

C

Canopy•8/25/23, 5:26 PM

Something that behaves like a traditional email server is probably the easiest way of putting it. At minimum be able to store emails from email workers and then serve them to a mail client using IMAP, I'm less sure if the reverse operation is possible of taking a mail client request to send an email and then sending it from that email address.

CCanopy Something that behaves like a traditional email server is probably the easiest w...

C

Cyb3r-Jak3•8/25/23, 5:30 PM

You won’t be able to have an imap client because workers/pages only workers with HTTP

C

Canopy•8/25/23, 5:31 PM

Sadness :( a web gui email system would be jank as all hell but possible I guess then?

CCanopy Sadness :( a web gui email system would be jank as all hell but possible I guess...

C

Cyb3r-Jak3•8/25/23, 5:33 PM

Yeah you’d still need a service for sending emails but it should work

C

Canopy•8/25/23, 5:34 PM

Ah that slightly sucks, I'd love to be able to do all my email stuff for services inside cloudflare's service but it looks like an email server is kinda unavoidable. :/

J

JoeDoe•8/25/23, 6:50 PM

anyone know how to fix a react app in typescript that won't deploy

J

JoeDoe•8/25/23, 6:50 PM

I have the environment vars correct, but I'm getting generic typescript errors, and it won't deploy

CCanopy Something that behaves like a traditional email server is probably the easiest w...

H

Hello, I’m Allie!•8/25/23, 7:05 PM

You could use JMAP tho

H

Hello, I’m Allie!•8/25/23, 7:05 PM

Just got to get Thunderbird onboard

HHello, I’m Allie!You could use JMAP tho

C

Canopy•8/25/23, 8:54 PM

That's a shout, thank you for the pointer, unfortunately I'd completely forgotten about the limit that the workers can't send mail to unverified emails so it'd still be hamstrung but it would let me create separate mailboxes for emails on my cf domains.

CCanopy That's a shout, thank you for the pointer, unfortunately I'd completely forgotte...

H

Hello, I’m Allie!•8/25/23, 9:10 PM

You just need an outbound provider like SendGrid or Mailgun

F

Fizzy Kombucha•8/25/23, 10:43 PM

has anyone here deployed an astrojs application to pages?
there are two ways to define api endpoints. astro has built in way. you just define a js file in your pages directory and it becomes an endpoint on your server.
like so:

/project
  /src
    /pages
      /api
        /endpoint.json.ts

/project
  /src
    /pages
      /api
        /endpoint.json.ts

/project
  /src
    /pages
      /api
        /endpoint.json.ts

/project
  /src
    /pages
      /api
        /endpoint.json.ts

cloudflare handles this fine. from my webpage i can execute the function with

fetch('/api/endpoint.json')

fetch('/api/endpoint.json')

but when i try the 'cloudflare way' of defining a function:

/project
  /functions
    /api
      /helloworld.ts
  /src
    /pages
      /endpoint.json.ts

/project
  /functions
    /api
      /helloworld.ts
  /src
    /pages
      /endpoint.json.ts

/project
  /functions
    /api
      /helloworld.ts
  /src
    /pages
      /endpoint.json.ts

/project
  /functions
    /api
      /helloworld.ts
  /src
    /pages
      /endpoint.json.ts

i cannot reach it from my webpage with

fetch('/api/helloworld')

fetch('/api/helloworld')

. i get a 404. however i can reach it fine when running locally with wrangler

E

Erisa•8/25/23, 10:45 PM

I have, I do them what you call the "cloudflare way" https://github.com/Erisa/erisa.uk/tree/main/functions
Note that functions needs to be in the root directory of the project, which it is in that case right?

F

Fizzy Kombucha•8/25/23, 10:47 PM

yes my cloudflare way looks like this:

/root-project
  /functions
    /api    
      helloworld.ts

/root-project
  /functions
    /api    
      helloworld.ts

/root-project
  /functions
    /api    
      helloworld.ts

/root-project
  /functions
    /api    
      helloworld.ts

i can see in my dashboard that the helloworld function did indeed deploy. it's just that i get a 404 when trying to

fetch

fetch

it from my webpage:

fetch('/api/helloworld')

fetch('/api/helloworld')

F

Fizzy Kombucha•8/25/23, 10:48 PM

F

Fizzy Kombucha•8/25/23, 10:54 PM

E

Erisa•8/25/23, 11:19 PM

I dont think using both simultaneously will work

F

Fizzy Kombucha•8/25/23, 11:22 PM

it's weird how you use the regular page function way and it works for you, but i use both and only the astro way works

as i mentioned, when i run the project locally with wrangler, it all works fine. but once deployed, the cloudflare function style seems unreachable

FFizzy Kombucha it's weird how you use the regular page function way and it works for you, but i...

E

Erisa•8/25/23, 11:24 PM

If you look at the routing configuration, astro is capturing

/:path

/:path

and routing all requests through it - this likely is taking priority over your own function

E

Erisa•8/25/23, 11:25 PM

Mine works because I dont have the astro method configured, it is deployed as a static Astro site with a functions dir

EErisa Mine works because I dont have the astro method configured, it is deployed as a ...

F

Fizzy Kombucha•8/25/23, 11:28 PM

oooh you have it as a static site with a functions dir? awesome i didn't know that was possible. i didn't bother trying. i thought i had to deploy mine with SSR

E

Erisa•8/25/23, 11:29 PM

If youre using the astro managed functions then yeah

E

Erisa•8/25/23, 11:29 PM

but if youre just using the cloudflare /functions then no need to be SSR

F

Fizzy Kombucha•8/25/23, 11:31 PM

that's good to know. i was a little sad i thought i had to use SSR. all of the tutorials (cloudflare and astro) mention having to use the astro-cloudflare plugin which seems to turn your project into SSR

E

Erisa•8/25/23, 11:44 PM

I dont blame them because the SSR features are no doubt very nice to use when you need them

E

Erisa•8/25/23, 11:44 PM

But no, Pages will work completely fine with a static Astro site

F

Fizzy Kombucha•8/25/23, 11:50 PM

thank you so much for your help

C

chientrm.com•8/26/23, 1:11 AM

Consider checking on Dash -> Pages to check for build status everytime I push, is there way to get push notification?

J

James•8/26/23, 1:23 AM

Long polling for build status is a good solution, it’s what https://github.com/WalshyDev/cf-pages-await does

GitHub

GitHub - WalshyDev/cf-pages-await: Wait for your Cloudflare Pages b...

Wait for your Cloudflare Pages builds to finish! Contribute to WalshyDev/cf-pages-await development by creating an account on GitHub.

J

James•8/26/23, 1:23 AM

You could also do something a bit lower tech like

curl

curl

some endpoint after your build script runs in pages ci. Not perfect, but might be good enough?

JJames You could also do something a bit lower tech like `curl` some endpoint after you...

C

chientrm.com•8/26/23, 1:24 AM

I wish a mobile app + push notifications

JJames Long polling for build status is a good solution, it’s what https://github.com/W...

C

chientrm.com•8/26/23, 1:32 AM

Oh sorry, I didn't see it clearly. By using Github Actions, I'll get push notifications on my Github Mobile app?

J

James•8/26/23, 1:33 AM

You could set something like that up I imagine, yes

JJames You could set something like that up I imagine, yes

C

chientrm.com•8/26/23, 1:38 AM

the repo doesn't say what API_TOKEN permissions are required.

EErisa But no, Pages will work completely fine with a static Astro site

F

Fizzy Kombucha•8/26/23, 7:24 AM

I did some more careful reading and building sample projects. And either there is a bug or cloudflare needs to update their documentation about deploying an astro site. My observations:

if you deploy an astro site using the astro cloudflare plugin (SSR), you cannot use the /functions directory. you must use astro endpoints
if you deploy astro static site (don't use astro cloudflare plugin), you can use the /functions directory

no where in the official documentation does it clearly mention this. either in cloudflare docs or astro docs:
https://developers.cloudflare.com/pages/framework-guides/deploy-an-astro-site/
https://docs.astro.build/en/guides/deploy/cloudflare/

replicate the issue with SSR:

pnpm create astro@latest # choose basic site, accept defaults
cd yourproject
pnpm run astro add cloudflare
# open astro.config.js and modify adapter line to look like this:
#   adapter: cloudflare({mode: "directory"})
mkdir functions
touch functions/hello.js
# add code to hello.js
# add code to a src/pages/index.astro to call to hello function.
# maybe add a button so when you click it calls fetch('/hello')
# run project locally:
wrangler pages dev -- npm run dev
# click button and you will see the function is called successfully
# now push your project up to github. and connect cloudflare to github repo, deploy it.
# you will see that you get a 404 when it tries to fetch('/hello')

pnpm create astro@latest # choose basic site, accept defaults
cd yourproject
pnpm run astro add cloudflare
# open astro.config.js and modify adapter line to look like this:
#   adapter: cloudflare({mode: "directory"})
mkdir functions
touch functions/hello.js
# add code to hello.js
# add code to a src/pages/index.astro to call to hello function.
# maybe add a button so when you click it calls fetch('/hello')
# run project locally:
wrangler pages dev -- npm run dev
# click button and you will see the function is called successfully
# now push your project up to github. and connect cloudflare to github repo, deploy it.
# you will see that you get a 404 when it tries to fetch('/hello')

pnpm create astro@latest # choose basic site, accept defaults
cd yourproject
pnpm run astro add cloudflare
# open astro.config.js and modify adapter line to look like this:
#   adapter: cloudflare({mode: "directory"})
mkdir functions
touch functions/hello.js
# add code to hello.js
# add code to a src/pages/index.astro to call to hello function.
# maybe add a button so when you click it calls fetch('/hello')
# run project locally:
wrangler pages dev -- npm run dev
# click button and you will see the function is called successfully
# now push your project up to github. and connect cloudflare to github repo, deploy it.
# you will see that you get a 404 when it tries to fetch('/hello')

pnpm create astro@latest # choose basic site, accept defaults
cd yourproject
pnpm run astro add cloudflare
# open astro.config.js and modify adapter line to look like this:
#   adapter: cloudflare({mode: "directory"})
mkdir functions
touch functions/hello.js
# add code to hello.js
# add code to a src/pages/index.astro to call to hello function.
# maybe add a button so when you click it calls fetch('/hello')
# run project locally:
wrangler pages dev -- npm run dev
# click button and you will see the function is called successfully
# now push your project up to github. and connect cloudflare to github repo, deploy it.
# you will see that you get a 404 when it tries to fetch('/hello')

both astro and cloudflare docs need to be updated to make this limitation clear IMO. the cloudfare docs make it seem as though you can use the functions directory while using SSR but this is not the case. (unless i'm doing something wrong)

Deploy an Astro site · Cloudflare Pages docs

Astro is an all-in-one web framework for building fast, content-focused websites. By default, Astro builds websites that have zero JavaScript runtime …

Astro Documentation

Deploy your Astro Site to Cloudflare Pages

How to deploy your Astro site to the web using Cloudflare Pages.

FFizzy Kombucha I did some more careful reading and building sample projects. And either there i...

E

Erisa•8/26/23, 10:31 AM

The behaviour is intentional so it must be a documentation problem, feel free to submit a docs PR yourself or I can later

S

Sopra•8/26/23, 10:41 AM

can anyone help me make a copy

C

Cyb3r-Jak3•8/26/23, 6:05 PM

Does it build locally? It could be that firebase isn’t compatible with the workers runtime

S

simpson•8/27/23, 1:56 PM

when connecting custom domains, does it count as two towards total count if you add www.domain.com and domain.com?

E

Erisa•8/27/23, 2:01 PM

yes

S

simpson•8/27/23, 2:04 PM

bummer

S

simpson•8/27/23, 2:04 PM

so realistically you get half of the advertised domains

C

Cyb3r-Jak3•8/27/23, 2:07 PM

How so? They are separate domains

Hi all, is it possible to deploy your Nuxt 3 app (with server directory, so the official back-end im

Similar Threads

Similar Threads

Similar Threads