inviare email senza php

Per inviare email tramite una pagina web bisogna sempre avere dalla nostra parte un solido script in PHP o in qualsiasi linguaggio di programmazione server side. Non più! Ora puoi inviare da una pagina HTML tutti i dati di un form, tutto questo grazie a Mandrill un potentissimo servizio offerto da MailChimp. 

Cos’è Mandrill?

Tra tutti questi primati si rischia di far confusione, per cui facciamo prima un po’ d’ordine.

Mailchimp è il principale concorrente di MailUp e affini, con 12000 invii gratuiti al mese per 2000 iscritti possiamo inviare newsletter e comunicazioni commerciali all around the world con una semplicità quasi disarmante.

Mandrill è molto simile anche se è stato creato per inviare tutte quelle comunicazioni transitorie come ad esempio la procedura di reset di una password, una conferma d’ordine o messaggi di benvenuto. Come Mailchimp offre 12000 invii gratuiti ed una dashboard con una montagna di dati al suo interno.

Se utilizzi Mailchimp gradirai sapere che Mandrill è integrabile al 101%, adesso non sto qui ad elencarti tutte le buone qualità di Mailchimp e di Mandrill per farlo di basta andare sui rispettivi siti ufficiali (Sito ufficiale Mailchimp e sito web ufficiale Mandrill).

But first…let me take an #APIKey

Prima di immergerci nel tutorial vero e proprio devi recuperare la tua API Key tramite la dashboard di Mandrill.

Per prima cosa registrati compilando il form

Form di registrazione di Mandrill

Una volta effettuata la registrazione, fai accesso alla piattaforma e nella colonna di sinistra clicca su “settings” in basso vedrai la sezione relativa alle API Key, creane una nuova cliccando sull’apposito pulsante. Arrivati a questo punto hai tutto quello che ti serve per poter iniziare il tutorial.

Markup HTML

Iniziamo questo tutorial dando un’occhiata al markup html che non è altro che un semplicissimo form.

Nell’head del documento oltre al foglio di stile e il file con il codice jquery che vedrai più avanti, vengono richiamati jQuery e le API di mandrill per un corretto funzionamento (non fate come me, che non capivo perché non funzionasse per accorgermi solo 20 minuti dopo di non aver inserito il file js di Mandrill).

Sorvolando su queste dimenticanze galattiche, analizziamo il body, il quale presenta i classici campi di input e una textarea, niente di particolare insomma.

Un tocco di stile non guasta mai

Potevo evitare di inserire il css, ma vedere l’html interpretato dallo user agent mi fa ribrezzo.

Se sei alle prime armi con il CSS ti consiglio di dare un’occhiata alla proprietà box-sizing è una manna dal cielo per prevenire la differenza di dimensione tra input, textarea e il contenitore nella quale vengono inseriti. Dai un’occhiata alla specifica ufficiale.

Mandrill e jQuery

Molto bene siamo arrivati al punto caldo di questo tutorial. Dai subito uno sguardo al codice jQuery per inviare email senza PHP.

Come i più esperti avranno già notato si fa uso di ajax per inviare le email, ma è meglio andare con ordine.

Per prima cosa lo script estrapola i valori dei campi email, nome e messaggio. Una volta estrapolati avvia tutta la procedura ajax per inviare i dati, specifico il metodo POST, l’URL di destinazione il quale sarà il file json di mandrill che smisterà il messaggio verso la giusta direzione.

I dati da passare a mandrill sono:

  • la API Key che hai generato nella prima parte del tutorial
  • il messaggio che contiene
    • la mail del mittente (from_email)
    • il nome del mittente (from_name)
    • l’header della mail (headers)
    • il soggetto dell’email (subject)
    • il messaggio vero e proprio (text)
    • l’indirizzo email del destinatario (to)

Infine troviamo due funzioni, la prima viene eseguita nel caso tutto vada a buon fine, se così fosse verrebbe visualizzato un alert con il messaggio di avvenuto invio. Altrimenti se qualcosa dovesse andare storto verrebbe visualizzato un alert con il messaggio di invio fallito.

Ultimissima cosa, ma importantissima è il return false finale, previene il refresh della pagina, se ciò non venisse bloccato i messaggi di successo e fallimento andrebbero persi e non conosceresti mai l’esito dell’invio.

Risultato finale

[codepen_embed height=”268″ theme_id=”8048″ slug_hash=”ohfrz” default_tab=”result”]See the Pen ohfrz by Manuel Ricci (@manuelvrc) on CodePen.[/codepen_embed]

Conclusioni

Ora sai come utilizzare Mandrill per inviare le email attraverso pagine HTML senza PHP. Conoscevi Mandrill? L’hai mai usato in qualche tuo progetto?