404 when submitting with AJAX - Gatsby 4.6

Support
,
1

Hello

I’m having an issue with a new site and Posting Netlify forms via fetch.

I’ve gone through every step of - [Support Guide] Form problems, form debugging, 404 when submitting

My form is appearing in my Netlify UI but I’m not relieving any submissions in the UI (not in spam)

I have another form on this website (contact) that I submit with the usual POST which works fine, it just seems to be the FETCH version.

I have a similar form on another site that works perfectly (i just re-used the code). - UPDATE SEE BELOW

It looks as though when submitting it’s getting a 404, I wondered whether the new DSG, SSR stuff in Gatsby adds a weird redirect…

  • I have tried submitting to an empty HTML file in a static folder, this comes back with a 400
  • I’ve tried removing gatsby-netlify-plugin in case that was causing redirects
  • I’ve tried adding empty _headers and _redirect files
  • I’ve investigated the headers (nosniff, referrer) on my site to see if that was stopping submissions.

I’ve just hit a dead end and I’m desperate for some help.

The form in question can be found at - Horse - Entry form
when submitting the form I have added plenty of console.logs in to show the data being submitted.

I’m happy to share a repo if any more information is needed.

UPDATE: I’ve had to push that form live removing FETCH and file upload.
I have tried my old site which used to work perfectly… no they are all broken - Example:

2

I’ve tried looking at this using netlify-cli.

When running locally, I can see

Request from ::1: POST /
Response with status 404 in 1 ms.

So it definitely seems like a redirect issue.
I’m retrying a blank HTML file in my static folder to see if that resolves the issue.

4

So I’ve not removed the FETCH entirely and gone back to a standard Netlify form with action='/succes'

This results in Function not found...

so there is definitely a redirect issue (DSG, SSR, SSG) issue, can anyone from Netlify help?

5

hey there @TheJuniperStudio , sorry to hear this is being so tricky. i will try and get som :eyes: on this.

1 Like
6

Hey @TheJuniperStudio,

Sorry about the delay on this one, I tried to check this now, but it appears that you’ve removed the JavaScript based form-submission for now. Could you point to the exact deploys with various versions of your form attempts, so we can check accordingly?

7

I think I now have this working live (I’ve updated the Horse - Entry Form. So this is no longer an issue.

However its is worth noting for anyone new to see this issue. Gatsby 4.x uses functions (DSG, SSR, SSG) which on your local machine, and on Netlify-CLI stops the form from submitting. So you pretty much can’t test these forms while developing.

The Essential Gatsby plugin when deploying to Netlify, resolves this issue and functions, which is turns allows the forms to work correctly when fully deployed.