Gatsby संपर्क फ़ॉर्म

Formgong team ·

Gatsby संपर्क फ़ॉर्म ब्राउज़र से Formgong को भेज सकता है। Gatsby स्थिर फ़ाइलें देता है, इसलिए POST लेने वाला सर्वर नहीं होता। Gatsby फ़ंक्शन या ईमेल रहस्य की ज़रूरत नहीं। फ़ॉर्म चिपकाएँ, कुंजी बदलें, और संदेश ईमेल तथा Telegram पर आते हैं। साइट स्थिर रहती है।

Gatsby
<form action="https://formgong.com/submit" method="POST">
  <input type="hidden" name="access_key" value="fk_your_access_key">
  <input type="hidden" name="_lang" value="hi">
  <label>नाम <input type="text" name="name" autocomplete="name" placeholder="आपका नाम" required></label>
  <label>ईमेल <input type="email" name="email" autocomplete="email" placeholder="you@example.com" required></label>
  <label>संदेश <textarea name="message" placeholder="हम आपकी कैसे मदद कर सकते हैं?" required></textarea></label>
  <div aria-hidden="true" style="position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)">
  <label>इस फ़ील्ड को खाली छोड़ें<input type="text" name="botcheck" tabindex="-1" autocomplete="off"></label>
</div>
  
  <button type="submit">भेजें</button>
</form>

Gatsby में फ़ॉर्म कैसे काम करते हैं

Gatsby, React पेजों को स्थिर HTML बनाता है। उसका फ़ॉर्म गाइड फ़ॉर्म सेवा, Netlify Forms, या आपका अपना सर्वर बताता है। Gatsby Functions दस्तावेज़ वाला सर्वर रास्ता है। वह फ़ंक्शन आप तैनात करते हैं और संभालते हैं।

src/pages की फ़ाइल में सादा HTML फ़ॉर्म रह सकता है। वह https://formgong.com/submit पर access_key, _lang और botcheck के साथ भेजता है। ब्राउज़र तक केवल GATSBY_ से शुरू नाम पहुँचते हैं। यह कुंजी सार्वजनिक है, इसलिए यह उपसर्ग ठीक है।

Gatsby में सेटअप

  1. Formgong में फ़ॉर्म बनाएँ और कुंजी कॉपी करें। वह fk_ से शुरू होती है।
  2. src/pages/contact.js जोड़ें और नीचे का फ़ॉर्म चिपकाएँ। क्रिया https://formgong.com/submit रखें।
  3. fk_your_access_key बदलें। GATSBY_FORMGONG_KEY जैसा नाम वैकल्पिक है। SMTP पासवर्ड कभी GATSBY_ नाम में न रखें।
  4. gatsby develop चलाएँ और जाँच भेजें। फिर gatsby build चलाएँ। POST ब्राउज़र में चलता है, इसलिए लाइव बिल्ड वैसा ही रहता है।
  5. अगर साइट Netlify पर है तो data-netlify न जोड़ें। केवल React वाला फ़ॉर्म HTML स्कैन में नहीं दिखता, जब तक आप form-name वाली छिपी प्रति भी न दें।

Formgong या Gatsby फ़ंक्शन?

Gatsby Function तब लें जब सबमिट को आपके डेटाबेस या निजी API तक जाना हो।

संपर्क फ़ॉर्म के लिए Formgong लें। SMTP, होस्ट करने वाला फ़ंक्शन, और React के लिए Netlify का छिपा HTML छूट जाता है।

सवाल और जवाब

क्या Gatsby में संपर्क फ़ॉर्म शामिल है?

नहीं। आधिकारिक गाइड फ़ॉर्म बैकएंड, होस्ट पर Netlify Forms, या आपका सर्वर बताती है। पेज स्थिर रहता है।

Netlify मेरा Gatsby फ़ॉर्म क्यों नहीं देखती?

Netlify बिल्ड के बाद HTML पढ़ती है। जो फ़ॉर्म React चलने के बाद बनता है, वह छूट जाता है। Formgong को भेजें, या छिपी स्थिर प्रति जोड़ें।

क्या fetch से पेज पर रहा जा सकता है?

हाँ। https://formgong.com/submit पर fetch करें और Accept: application/json भेजें। JavaScript बंद हो तो HTML फ़ॉर्म फिर भी चलता है।

क्या Gatsby बंडल में कुंजी सुरक्षित है?

हाँ। वह केवल आपके फ़ॉर्म की प्रविष्टियाँ लेती है। Pro पर डोमेन सीमित कर सकते हैं। निजी कुंजी GATSBY_ नाम में न रखें।

मुफ़्त शुरू करें