Share
Ora che si dispone di un sito Web che utilizza un file system flat, si desidera ottenere un feedback dai propri utenti. Aggiungere Disqus è facile poiché è tutto il codice JavaScript aggiunto alla pagina, ma non è quello che vuoi. Vuoi che siano in grado di inviarti tramite email direttamente in modo che tu possa rispondere solo a loro.
Potresti creare un sistema tutto JavaScript per inviare email direttamente dal computer dell'utente, ma questo lascia la tua email aperta agli spammer in grado di recuperarlo dal tuo codice e venderlo ad altri spammer. Pertanto, è necessario nascondere il proprio indirizzo e-mail sul server.
Questo tutorial riguarda l'aggiunta di un sistema di messaggi di posta elettronica al tuo nuovo PressCMS (vale a dire. phpPress, rubyPress, nodePress, e goPress). Sto iniziando con il front-end e poi indirizzando il back-end per ogni sistema. Suppongo che tu abbia già questi server sul tuo sistema.
Poiché il codice di front-end sarà lo stesso per ciascun server, sarà necessario copiare questi nuovi file in ciascuna directory del server. Pertanto, parlerò dei file nel percorso come riferimenti dalla directory del server.
Invece di aggiungere uno stile specifico del modulo al tema, questo script del modulo ha tutto in un unico posto. Crea il file questions.html nel sito / parti directory per il sito web con il seguente contenuto:
Questo crea una forma base che richiede un nome completo (nome e cognome), e-mail e un messaggio. Questo modulo utilizza espressioni regolari per garantire che il nome e l'indirizzo e-mail siano validi. Se qualunque cosa l'utente immette in quei campi non corrisponde all'espressione regolare nel modello direttiva, quindi il modulo non sarà presentato. Un popup chiederà all'utente di compilare correttamente il campo con il messaggio nel titolo parametro. Ogni campo di input ha il necessario anche primitivo. Ciò impedisce l'invio di moduli vuoti. Questa è la minima convalida dei dati che dovresti usare sul front-end.
Il azione direttiva nel modulo elemento dice al browser web quale indirizzo inviare i dati del modulo a. Il metodo direttiva dice al browser di inviare come inviare metodo. I dati del modulo verranno inseriti nell'URL della richiesta di post al server. Questo è un Stringa della domanda. Il server elabora quindi le informazioni nella stringa di query.
Nel sito / pagine directory, crea il file contact.md e inserisci questo codice:
### Contattaci Questo è un semplice modulo di contatto. Inserisci il tuo nome, il primo e l'ultimo, l'indirizzo email e il messaggio. Ti risponderò il prima possibile. Grazie. domanda
Una volta salvato, puoi provare le pagine nel server. Nel browser, apri la pagina http: // localhost: 8081 / contact.
Pagina del modulo di contatto Il Contattaci la pagina apparirà come nella foto sopra. Notare l'evidenziazione del campo Nome direttamente al momento del caricamento. Il messa a fuoco automatica direttiva crea questo comportamento desiderato. È sempre buona norma avere il primo campo che l'utente deve digitare in focus automaticamente.
Dopo aver inviato il messaggio, un messaggio di conferma per l'utente sarebbe bello. Nel sito / pagine directory, crea il file messagesent.md e inserisci questo codice:
### Il messaggio è stato inviato Grazie mille per aver dedicato del tempo a mandarmi un messaggio. Risponderò il prima possibile.
Solo un semplice messaggio in modo che l'utente sappia che il messaggio è stato inviato correttamente. Puoi espandere come preferisci.
Pagina di conferma inviata messaggio Sto disinfettando il messaggio dato dall'utente, sto usando il Lunedi blu biblioteca. Per caricare quella libreria sul tuo sistema, devi eseguire questa riga di comando:
vai a get github.com/microcosm-cc/bluemonday
Questo renderà la libreria disponibile per il tuo programma. Questa è l'unica libreria non standard necessaria.
Apri il goPressServer.go file e aggiungilo all'inizio del file all'interno del file import () dichiarazione:
"fmt" "github.com/hoisie/web" "net / smtp" "github.com/microcosm-cc/bluemonday"
Inviare messaggi di posta elettronica dal server richiede queste librerie. Dopo la linea che ha goPress.DefaultRoutes ( chiamata di funzione, aggiungere il seguente codice:
Accentsconagua
// // Imposta il percorso speciale per l'elaborazione dei moduli. // goPress.SetPostRoute ('/ api / message', postMessage)Questo imposta un percorso postale di / Api / messaggio per eseguire la funzione postMessage (). Alla fine del file, aggiungi questo codice:
// // Funzione: postMessage // // Descrizione: Questa funzione invierà // il messaggio da loro // il sito web al proprietario // del sito. // // Input: // ctx Il server web // contesto. // func postMessage (ctx * web.Context) stringa // // Ottieni le informazioni sul post e invia l'// email. // nome: = ctx.Params ["Nome"] da: = ctx.Params ["Email"] p: = bluemonday.UGCPolicy () messaggio: = p.Sanitize (ctx.Params ["Message"]) a: = ""subject: =" Messaggio dell'utente: "+ name +" di CustomCT.com "sendEmail (to, from, subject, message) // // Ottieni il contenuto della pagina dei messaggi e // lo elabora // pgloc: = goPress .SiteData.Sitebase + "pages / messagesent" return goPress.RenderPageContents (ctx, goPress.GetPageContents (pgloc), pgloc) // // Funzione: sendEmail // // Descrizione: Questa funzione invia un // messaggio email. / / // Input: // a L'indirizzo email // per inviare // // messaggio // dall'indirizzo email // della persona // che invia il // messaggio // oggetto Oggetto del messaggio // messaggio // Il messaggio di // email // func sendEmail (a stringa, da stringa, oggetto stringa, stringa messaggio) body: = fmt.Sprintf ("A:% s \ r \ nSoggetto:% s \ r \ n \ r \ n% s ", a, oggetto, messaggio) auth: = smtp.PlainAuth (" "," "," "," smtp.gmail.com ") err: = smtp.SendMail (" smtp.gmail.com:587 ", auth, from, [] stringa a, [] byte (corpo)) se err! = nil // // Elabora l'errore. Attualmente, supponendo che // non sia un problema. //
Queste due funzioni costituiscono il gestore per l'elaborazione delle e-mail inviate dal browser. Il / Api / messaggio percorso chiama il postMessage () funzione. Recupera le informazioni inviate dal modulo compilato dall'utente, disinfetta il messaggio con la libreria BlueMonday e invia un'e-mail al proprietario del sito utilizzando il invia una email() funzione. Dovrai inserire il tuo indirizzo Gmail al posto di
Nel goPress.go file, aggiungere questa funzione dopo il SetGetRoute () funzione:
// // Funzione: SetPostRoute // // Descrizione: Questa funzione fornisce un // accesso facile alla // variabile web setup in // questa libreria. // // Input: // route Route to setup // handler Funzione per eseguire quel // route. // func SetPostRoute (route string, handler interface ) web.Post (route, handler)
Questa funzione è esattamente come la SetGetRoute () funzione. L'unica differenza sta usando il web.Post () funzione.
Con queste modifiche, il tuo server goPress può ora inviare le tue e-mail dall'utente.
Per inviare e-mail dal nodo, è necessario prima installare il file libreria nodemailer e il libreria parser del corpo con la seguente riga di comando:
npm install -save nodemailer npm install -save body-parser
Quindi è necessario caricare le nuove librerie e configurare l'oggetto mailer. Nella parte superiore del nodePress.js file, dopo aver caricato l'ultima libreria, aggiungi queste righe:
var nodemailer = require ('nodemailer'); // https://nodemailer.com/ var bodyParser = require ('body-parser'); // https://github.com/expressjs/body-parser // // crea un oggetto transporter riutilizzabile utilizzando // trasporto SMTP predefinito // var transporter = nodemailer.createTransport ('smtps: //:@ Smtp.gmail.com '); Questo caricherà la libreria nodemailer e configurerà il componente riutilizzabile per l'invio di e-mail. Devi sostituire
Dopo la riga che inizializza la variabile nodePress, aggiungi questo codice:
// // Configura la libreria del parser del corpo. // nodePress.use (bodyParser.urlencoded (extended: true));
Ora, dopo l'ultimo nodePress.get () chiamata di funzione, aggiungi questo codice:
nodePress.post ('/ api / message', funzione (richiesta, risposta) // // imposta i dati di posta elettronica // var mailOptions = from: request.body.Email, a: '', oggetto:' Messaggio da '+ request.body.Name +' sul modulo di contatto. ', text: request.body.Message, html: request.body.Message; // // Invia l'email. // transporter.sendMail (mailOptions, function (error, info) if (error) return console.log (error); // // Invia l'utente al messaggio è stata inviata okay page. // response.send ( pagina ("messagesent"));); ); Questo è il gestore per il / Api / messaggio indirizzo. Questa funzione ottiene le informazioni inviate dal modulo, crea il messaggio e-mail appropriato e la invia all'indirizzo e-mail indicato in /messaggio inviato pagina. Il middleware del parser del corpo ha i parametri dell'URL salvati nel request.body variabile e adeguatamente igienizzato.
Questo codice funziona per l'installazione di Gmail senza autenticazione a due fattori. Se si dispone dell'autenticazione a due fattori, è possibile fare riferimento a Nodemailer documentazione per configurarlo.
Per inviare e-mail in Ruby, è necessario installare il ruby-gmail libreria con la seguente riga di comando:
gem installa ruby-gmail
A seconda della configurazione di Ruby, potrebbe essere necessario utilizzare sudo di fronte al comando. Ora per caricare la libreria, aggiungi la seguente riga all'inizio del rubyPress.rb file:
richiede "gmail" # https://github.com/dcparker/ruby-gmail
Dopo tutto il ottenere definizioni, aggiungere le seguenti righe:
post '/ api / message' do # # Ottieni i parametri dal modulo. # name = params [: Name] email = params [: Email] message = params [: Message] # # Crea e invia l'email. # Gmail.new ('','') do | gmail | gmail.deliver do a ""dall'oggetto dell'email" Messaggio da "+ nome text_part do body message end end end # # Invia l'utente alla pagina di invio dei messaggi. # page 'messageent' end Con queste aggiunte, il tuo server rubyPress può elaborare moduli di posta elettronica. Una volta che cambi
L'ultimo server da modificare è il server phpPress. Per aggiungere funzionalità di posta elettronica al server, ho intenzione di installare il libreria phpmailer. Questa è la libreria più utilizzata in PHP per lavorare con le e-mail. Per installare la libreria, è necessario eseguire questi comandi da riga di comando nella directory phpPress:
compositore update compositore richiede phpmailer / phpmailer
Sfortunatamente, l'aggiornamento del compositore aggiornerà la libreria di LightnCandy. Questo è buono perché è molto più veloce e facile da usare. Ma rompe il codice del server. Nel file index.php, individuare il file ProcessPage () funzione e sostituirlo con il seguente codice:
// // Funzione: ProcessPage // // Descrizione: questa funzione elabora // una pagina nel modello, // elabora tutte le macro di Moustache // ed elabora tutti gli // shortcode. // // Input: // $ layout Il layout per // la pagina // $ page Le pagine main // contents // function ProcessPage ($ layout, $ page) global $ site, $ parts, $ helper; // // Ottieni i contenuti della pagina. // $ parts ['content'] = figurePage ($ page); // // Primo passaggio su Handlebar. // $ phpStr = LightnCandy :: compile ($ layout, $ helper); $ renderer = LightnCandy :: prepare ($ phpStr); $ page = $ renderer ($ parti); // // Elabora i codici brevi. // $ pageShort = processShortcodes ($ page); // // Secondo passaggio manubri. // $ phpStr = LightnCandy :: compile ($ pageShort, $ helper); $ renderer = LightnCandy :: prepare ($ phpStr); $ page = $ renderer ($ parti); // // Restituisce i risultati. // return ($ page);
Confrontandolo con il vecchio codice, non è più necessario lavorare con un file temporaneo. È tutto fatto in memoria ed è quindi molto più veloce. Ora, in cima al index.php file, aggiungi questo dopo la libreria Jade:
// // Mailer PHP: https://github.com/PHPMailer/PHPMailer // richiede 'venditore / phpmailer / phpmailer / PHPMailerAutoload.php';
Questo carica la libreria phpmailer. Ora, dopo l'ultimo $ App-> get () funzione, aggiungi questo codice:
// // Questo percorso serve per elaborare la richiesta di posta dal modulo // email sul sito web. // $ app-> post ('/ api / message', funzione (Richiesta $ request, Response $ response) global $ _POST; // // Ottieni le variabili del post. // $ Nome = $ _POST ['Nome' ]; $ Email = $ _POST ['Email']; $ Messaggio = $ _POST ['Messaggio']; // // Crea il messaggio e-mail e lo invia. // $ mail = new PHPMailer; $ mail-> isSTP ( // Imposta il mailer per utilizzare SMTP $ mail-> Host = 'smtp.gmail.com'; // Specifica server SMTP principali e di backup $ mail-> SMTPAuth = true; // Abilita autenticazione SMTP $ mail-> Nome utente = ''; // nome utente SMTP $ mail-> password = ''; // password SMTP $ mail-> SMTPSecure = 'tls'; // Abilita la crittografia TLS, 'ssl' ha anche accettato $ mail-> Port = 587; // Porta TCP per connettersi a $ mail-> setFrom ($ Email, $ Nome); $ Mail-> addAddress ('',''); // Aggiungi un destinatario $ mail-> Subject = "Messaggio da $ Name"; $ mail-> Corpo = $ Messaggio; if (! $ mail-> send ()) echo 'Il messaggio non può essere inviato.'; echo 'Errore Mailer:'. $ Mail-> ErrorInfo; else $ newResponse = SetBasicHeader ($ response); $ NewResponse-> getBody () -> scrittura (pagina ( 'messagesent')); ritorno ($ newResponse); ); Questo è un gestore di richiesta post per il / Api / messaggio sentiero. Recupera i dati del modulo inviati dal browser, crea un'e-mail con esso e invia l'e-mail. PHP prende automaticamente tutti i parametri URL e li inserisce nell'array globale $ _POST.
Dovrai sostituire $ Mail-> Host indirizzo pure.
Ti ho mostrato come aggiungere facilmente un modulo email a un sito pressCMS. Il download per questo tutorial ha tutti questi server con le loro modifiche. È quindi possibile scaricarlo invece di digitare. Ho gestito un po 'di errori. Lascerò il resto a te come esercizio.
Il metodo che ho insegnato qui è pubblicando i dati del modulo con i dati nell'URL. Molti siti al giorno d'oggi usano un API REST con i dati in a JSON stringa nel corpo per eseguire l'azione. Queste routine sono facilmente adottate per quella metodologia, ma questo è un esercizio per te (o forse un futuro tutorial). Ora che sai come farlo in questo modo, aggiungi i tuoi moduli al tuo sito. Questo tipo di personalizzazione è molto divertente. L'unico limite è la tua immaginazione.
