405: Method not allowed on form submit with Next.Js

Support
1

The Netlify Forms integration of a site I have been working on suddenly stopped working. A week ago, the images of the site were not correctly loading so I rebuild the site using edge images and that got it up and running again I think.

Anyways, after the rebuild the forms stopped working. When using a form, for example at Contact | K-Motion, I het a 405 error Method not allowed.

I read on the forum here that it might have to do with non-static site generation, but I checked this and the redirect page is build/served statically by Next.Js.

ChatGPT suggested nonsense, so I was hoping you could help me out :slight_smile:

2

@jorritvanderheide What do you mean by redirect page?

This page is definitely not static:

image

The error isn’t a standard Netlify error:

image
image1356×446 16.7 KB

Visiting the page directly clearly shows that it’s Next.js powered:

screenshot-20240716-202947
screenshot-20240716-202947917×703 143 KB

See:

3

With ‘redirect page’ I meant the page the form points to using its action field, which is set to /contact/success.

I don’t understand the difference between Netlify powered and Next.Js powered I think. It is definitely a page I built with Next.Js, but it should be a static page according to my build log:

image
image1371×941 131 KB

I will see if the resource you provides can shed some light on my issue.

4

After reading your link, I better understand what the issue is now. Seems I have to do quite a lot of refactoring to get everything working again :frowning:

5

I eventually reverted to runtime v4 but the issue still persisted. Then, I turned off Network Edge Images (using env variable) and then everything started working again.

6

Hi @jorritvanderheide,

Thanks for following up.

I see you’re using Next.js 13.5.6, in which case you’ll want to use the version 5 of the Netlify/Next.js runtime.

Along with the Netlify doc link that nathanmartin provided, there is an example on that page under Here’s a simplified example of the form component: ).

Additionally, we have a Starter Template with Netlify forms code that you can follow as well and compare your code:

You can see the html here:

https://github.com/netlify-templates/next-platform-starter/blob/main/public/__forms.html

And the jsx here:

https://github.com/netlify-templates/next-platform-starter/blob/main/components/feedback-form.jsx