The payment gateway was working fine locally, but crashes on Netlify

[sohinim98]

The payment gateway worked fine e2e locally (both gatsby develop and gatsby build also work fine), however when using the live key on Netlify, I get this error:

@raae Any idea how to fix this issue?

This happens when I click on the Donate button, instead of going to the Stripe gateway.

Gatsby info:

System: OS: macOS 11.6.4 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Shell: 5.8 - /bin/zsh Binaries: Node: 18.12.1 - /usr/local/bin/node Yarn: 1.22.5 - /usr/local/bin/yarn npm: 8.19.2 - /usr/local/bin/npm Languages: Python: 2.7.16 - /usr/bin/python Browsers: Chrome: 109.0.5414.87 Firefox: 83.0 Safari: 15.3 npmPackages: gatsby: ^5.3.3 => 5.4.2 gatsby-image: ^3.11.0 => 3.11.0 gatsby-plugin-image: ^3.3.2 => 3.4.0 gatsby-plugin-manifest: ^5.3.1 => 5.4.0 gatsby-plugin-react-helmet: ^6.3.0 => 6.4.0 gatsby-plugin-sharp: ^5.3.2 => 5.4.0 gatsby-plugin-smoothscroll: ^1.2.0 => 1.2.0 gatsby-remark-images: ^7.3.1 => 7.4.0 gatsby-source-filesystem: ^5.3.1 => 5.4.0 gatsby-transformer-sharp: ^5.3.1 => 5.4.0 npmGlobalPackages: gatsby-cli: 5.3.1

[raae]

Manually check if the provided Gatsby Function is working by going to https://<your domain>/api/@raae/gatsby-plugin-donations/donation. If it gives you a meaningful error message it is working and your donate button should work. If it does not it means that Netlify has not deployed the Gatsby Function correctly.

Make sure to add gatsby-plugin-netlify and also make sure the Netlify Essential Gatsby Plugin is activated.

[sohinim98]

Thank you for your response - that was helpful! Adding gatsby-plugin-netlify and Netlify Essential Gatsby Plugin gives me a meaningful error message now:

how do I fix this issue? I have added Stripe's live test key under Settings -> Environment variables

Let me know if I am missing something - it seems to be an issue with the secret key! Thanks again

[raae]

What is the error you are getting now when trying to use the donate button?

[sohinim98]

Same error as the one I posted above "GET not allowed"

[raae]

Could you share your donate button call? It needs to use a POST request and not GET request.

[sohinim98]

@raae here is the code for it:

                    <form action="/api/@raae/gatsby-plugin-donations/donation" method="POST">
                        <fieldset className="donation">
                            <p>
                                Support our artists and the cause by donating if you can! 💘
                            </p>
                            <p>
                                <label htmlFor="amount" className="donation-input">Amount 💰 (in CAD)</label>
                                <br />
                                <input type="number" id="amount" name="amount" defaultValue="10" />
                            </p>
                            <p>
                                <button className="donation-btn">Donate</button>
                            </p>
                        </fieldset>
                    </form>}

Did you want me to send the API response from the network tab?

[raae]

Yes, that would be good.