question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Nuxt 3.0.0-rc.11 with Nitro 0.5.12> /Server/api functions fail on POST requests, GET methods are OK when publishing to Cloudflare pages functions)

See original GitHub issue

Environment

Nuxt 3.0.0-rc.10-27718444.40d0907 with Nitro 0.5.2-27718085.c24dbcf
Cloudflare pages with functions

Reproduction

https://stackblitz.com/edit/github-dxg5qg?file=server/api/customer.get.js

Describe the bug

Deployment of my Nuxt 3 app that contains following folder server folder structure

/server/api/customer.post.js <- POST fail with 405 method not allowed on cloudflare pages /server/api/customer.get.js <-- GET works. /server/api/test.js <-- should response to all routes

Nitro preset : nitro: { preset: ‘cloudflare_pages’, },

Upon pushing to github, cloudflare initiates a page build with the following successful log entries on cf pages:


Nuxt 3.0.0-rc.11-27719556.94377b1 with Nitro 0.5.3-27719444.ff99330
--
18:54:51.303 | ℹ Client built in 2421ms
18:54:51.304 | ℹ Building server...
18:54:52.513 | ✔ Server built in 1209ms
18:54:52.572 | ✔ Generated public .output/public
18:54:52.588 | ℹ Building Nitro Server (preset: cloudflare_pages)
18:54:59.396 | ✔ Nitro server built
18:54:59.419 | └─ functions/path.js (414 kB) (132 kB gzip)
...
18:55:16.586 | Success: Assets published!
18:55:18.083 | Success: Your site was deployed!

When visiting the domain all looks good and page is published! Now time to test the /functions folder

GET https://www.domain.com/api/customer HTTP/1.1

RESULT : 200 OK

POST https://www.domain.com/api/customer HTTP/1.1

RESULT : 405 NOT ALLOWED

POST https://www.domain/api/incorrectpath HTTP/1.1

RESULT : 405 NOT ALLOWED (should return 404 NOT FOUND)

Talking to Cloudflare discord support they say <quote>

Let them know that if they want to discuss it then feel free to pop on here. Cloudflare Pages never returns 405s, so this is Nitro

  • No POST handlers work, either in the .post.js file or the .js file
  • It works in dev (so in Vite), not prod
  • The command (make sure they know the command is build not generate)

Strangely when I POST to a route that does not exist like POST https://www.domain.com/api/blah, the result is also 405 NOT ALLOWED, hence it seems all POST requests are being block before the function is actually triggered, but for some reason all GET routes are OK.

to recreate the issue

  • use the stackblitz template above : https://stackblitz.com/edit/github-dxg5qg?file=server/api/customer.get.js
  • run npm run build , not generate, as generate will not create /functions folders
  • npx wrangler pages dev .output/public OR npx wrangler pages publish .output/public
  • visit xxx.com/api/customer – this will be a GET and it will work
  • make a postman POST request to xx.com/api/customer - it will fail with 405 (if not pls let me know)

According to the nitro docs : it should just work.

Additional context

Cf discord channel has been informed of this issue and says they would be happy to connect with nuxt core team, please contact the discord community member @isaac-mcfadyen#4321 on cloudflare-pages discord channel.

Issue Analytics

  • State:open
  • Created a year ago
  • Reactions:6
  • Comments:6

github_iconTop GitHub Comments

3reactions
ricky11commented, Oct 3, 2022

sorry hoping to get some eyes on this issue

1reaction
PoisnFangcommented, Nov 12, 2022

I did a bit of digging on this, the error might be somewhere here

export async function onRequest (ctx: CFRequestContext) {
  try {
    // const asset = await env.ASSETS.fetch(request, { cacheControl: assetsCacheControl })
    const asset = await ctx.next()
    if (asset.status !== 404) { // GET returns 404; Other methods return 405
      return asset
    }
  } catch (_err) {
    // Ignore
  }

The GET method will return 404 every other method will return 405 Ultimately the execution will end up in wrangler > miniflare-dist > index.mjs > generateHandler > generateResponse and it calls this code:

    if (!request.method.match(/^(get|head)$/i)) {
      return new MethodNotAllowedResponse();
    }

That is the cause of this behavior.

Not sure what the recommended fix would be… @DaniFoldi ?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Deploy a Nuxt.js site · Cloudflare Pages docs
Documentation for Cloudflare Pages, the best way to deploy your static and JAMstack sites.
Read more >
Nuxt3 deployment with Cloudflare pages failed - Stack Overflow
I worked around the problem with: Adding Nitro output config [1] [2] to nuxt.config.ts : export default defineNuxtConfig({ "nitro": ...
Read more >
Submit a Static Website Form with Cloudflare Workers
After that, the method formats the body of the request to send to our Cloudflare Worker & then sends it as a POST...
Read more >
Cloudflare Pages with Functions w/ Obinna Ekwuno - YouTube
Join me in this new series where I live stream with a guest to hack on a fun project! Music by Naomi -...
Read more >
Submit a Static Website Form with Cloudflare Workers
tsx file has the bulk of our logic, including the handleRequest method. export async function handleRequest(request: Request, sentry: ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found