Il plugin Static Forms non è un backend per moduli
Analizza l’invio e chiama un gestore fornito da te. Devi ancora scrivere archiviazione, notifiche, antispam ed errori. È il lavoro vero e il plugin non lo fa.
integrazioni · hosting platform
Cloudflare Pages distribuisce il sito da circa 300 città ma non accetta moduli per te. Non ha l’equivalente di Netlify Forms. Il tutorial ufficiale rimanda a terzi e il plugin Static Forms per Pages Functions non è un servizio moduli: intercetta il POST e lo passa a una funzione da scrivere, collegata a un namespace KV da predisporre.
Puntare action a mailcontact elimina tutto quel livello. Niente directory Functions, binding KV, configurazione wrangler o Worker da mantenere. Gli invii arrivano nella casella e ti avvisano via Discord, Slack, email o webhook.
configurazione consigliata
Aggiungi questo HTML al sito oppure usa generatore di moduli. Sostituisci il link del modulo con il tuo. Lo script ospitato inserisce il controllo nascosto, gestisce invio e verifica automatica e conserva la bozza in caso di errore. Tu controlli HTML e CSS. I moduli Free mostrano un link visibile “Processed by mailcontact.app”; Pro e Plus no. I messaggi seguono la lingua del browser; imposta data-mailcontact-language="fr" sul modulo per impostare il francese.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST" data-mailcontact-form lang="it" data-mailcontact-language="it">
<input type="hidden" name="_language" value="it" />
<fieldset>
<legend>Contattaci</legend>
<label>
Nome (facoltativo)
<input name="name" type="text" autocomplete="name" maxlength="200" />
</label>
<label>
Email
<input name="email" type="email" autocomplete="email" maxlength="320" required />
</label>
<label>
Messaggio
<textarea name="message" rows="5" maxlength="5000" required></textarea>
</label>
<noscript>
<div aria-hidden="true" style="position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;">
<label>Sito web
<input name="company_website" type="text" tabindex="-1" autocomplete="off" />
</label>
</div>
</noscript>
<button type="submit">Invia messaggio</button>
</fieldset>
<p data-contact-status role="status" aria-live="polite" aria-atomic="true"></p>
</form>
<script defer src="https://mailcontact.app/forms/v1.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>Per un componente con un proprio gestore di invio, carica lo stesso script e usa MailContact.prepare(form) e MailContact.send() al posto del marcatore automatico. Consulta riferimento per interfacce personalizzate per caricamento, messaggi e attribuzione Free.
lo snippet
Questo esempio invia direttamente all’API. Mantieni il campo obbligatorio company_website presente e vuoto. Gli invii nativi aprono JSON in caso di successo o una pagina di verifica se serve. Gli script personalizzati senza supporto alla verifica inviano i messaggi sospetti in Spam per revisione; anche lo spam evidente resta lì senza notifiche né consumo di quota. Una risposta di successo conferma la ricezione, anche per revisione, oppure lo scarto silenzioso di un controllo compilato. Vedi protezione antispam per il comportamento completo.
<!-- No functions/ directory. No KV namespace. No wrangler.toml. -->
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST">
<input type="text" name="name" placeholder="Your name" required />
<input type="email" name="email" placeholder="[email protected]" required />
<textarea name="message" placeholder="What's on your mind?" required></textarea>
<!-- Bots fill this in. Humans never see it. -->
<input type="text" name="company_website" type="text" tabindex="-1" autocomplete="off"
style="position:absolute;left:-10000px" aria-hidden="true" />
<button type="submit">Send</button>
</form>come funziona
Una casella per progetto. Chiamala come il progetto Pages e ottieni subito endpoint modulo ed email.
Qualunque cosa pubblichi su Pages, HTML, build Astro o bundle React, il modulo è semplice markup nella pagina. Il comando di build non cambia.
git push o wrangler pages deploy. Il modulo funziona dal primo deploy di anteprima, su ogni alias di branch e dominio personale, senza setup per ambiente.
perché mailcontact
Analizza l’invio e chiama un gestore fornito da te. Devi ancora scrivere archiviazione, notifiche, antispam ed errori. È il lavoro vero e il plugin non lo fa.
Workers fattura richieste e CPU; un gestore che invia email richiede API e chiave. Un endpoint esterno non ha budget d’invocazioni da sforare né percorsi a freddo da correggere alle due di notte.
Cloudflare indirizza i nuovi progetti full stack verso Workers. Un modulo con markup verso URL esterno non dipende dal prodotto che ospita il sito: non ha legami di piattaforma da migrare.
FAQ
No. Netlify rileva un attributo del modulo al deploy e conserva gli invii; Cloudflare non offre questa funzione. Le soluzioni documentate sono il plugin Static Forms, che richiede di scrivere il gestore e collegare l’archiviazione, o un servizio esterno. La piattaforma non ha un’opzione senza codice.
È un collegamento infrastrutturale, non un prodotto completo. Il plugin intercetta il POST di un modulo con data-static-form-name e lo passa a un gestore respondWith che implementi tu. Salvare messaggi, notificare e filtrare spam resta da costruire. Se vuoi scriverlo, il plugin aiuta; se vuoi evitarlo, un endpoint è la strada più breve.
Sì. Non ci sono conflitti. Il modulo è un action HTML verso un’altra origine: directory functions/, middleware e binding restano intatti. Sostituisce solo la parte di Functions che avresti scritto per i contatti.
Sì. L’endpoint accetta POST da qualsiasi dominio: anteprime *.pages.dev, alias di branch e dominio personalizzato inviano alla stessa casella senza configurazioni per ambiente o liste di autorizzazione.
correlati
Moduli e un vero indirizzo email insieme, con notifiche dove lavori. Inizia con un account gratuito.
Crea un modulo gratisNon serve la carta di credito. Free include un progetto e 50 messaggi dal modulo al mese.