Невозможно получить отправку формы на Netlify развертывает - PullRequest
Новая
       19

Невозможно получить отправку формы на Netlify развертывает

2 голосов
/ 06 марта 2019

Я использую простую форму, взятую из одного из документов, связанных с Netlify: 

<form name="contact" action="/" method="post" data-netlify="true">

    <div className="field">
        <label htmlFor="name">Name</label>
        <input type="text" name="name" id="name" value="dave"/>
    </div>
    <div className="field">
        <label htmlFor="email">Email</label>
        <input type="text" name="email" id="email" value="email@email.com" />
    </div>
    <div className="field">
        <label htmlFor="message">Message</label>
        <textarea name="message" id="message" rows="6"></textarea>
    </div>   
    <input type="submit" value="Send Message" className="" />

</form>

При использовании gatsby develop и работе с / отправке формы все работает нормально. Я не получаю ошибок и перенаправляюсь на домашнюю страницу, как и ожидалось.

После развертывания сайта с помощью Netlify и попытки отправки формы появляется следующая ошибка страницы:

netlify-form-error.PNG

В моем бэкэнде Netlify форма отображается в консоли, но я не могу / не получаю представления.

Я использую barebones gatsby-config.js, только с включением gatsby-source-wordpress и gatsby-plugin-google-analytics.

Я также попытался добавить /no-cache=1 для формирования действия.

Кто-нибудь может посоветовать?

Также стоит отметить, что я закодировал свою форму как компонент и импортировал ее в свой нижний колонтитул как таковой. Таким образом, он может быть импортирован несколько раз на разных страницах, как указано в пункте 3 этого ответа StackOverflow .

Спасибо.

1 Ответ

1 голос
/ 15 марта 2019

Я узнал, что, поскольку я использую формы Gatsbyjs и Gatsby + Netlify = javascript, мне нужно было добавить еще одну input type="hidden" в мою форму: 

<form name="my-form" ... >
   <input type="hidden" name="form-name" value="my-form" />

Документация для этого не была сразу ясна, но ниже приведены некоторые ссылки, которые обращаются к этому:

...