« Ritorna al blog

Ritorna alla lista completa degli articoli

Mettiti alla prova: invio di una email in formato testo e html

PHP - SFIDE - gennaio 24, 2022

In questo esercizio si dovrà programmare due tipi di email: una di tipo testuale e l'altra di tipo html. Il file, start.php, presenta due funzioni da completare e una costante da riempire con l'indirizzo email del destinatario:

  • define("EMAIL_TO", '')
  • mail_text()
  • mail_html()

start.php

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Invio email in formato testo e html</title>

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
</head>

<body>

    <?php

    // Costanti
    // da completare
    define("EMAIL_TO", '');

    define("CONST_ERROR", 'error');

    // Funzioni
    function redirect($page,$msg){
        header("location:" . $page . '?msg=' . $msg);
        exit();
    }
    
    function required_field($field)
    {
        $res = !empty($field) ? $field : CONST_ERROR;

        return $res;
    }

    function required_email($email)
    {
        $res = !empty($email) && filter_var($email, FILTER_VALIDATE_EMAIL) ? $email : CONST_ERROR;

        return $res;
    }

    function get_msg_alert($str_msg)
    {
        $msg = '<div class="container">';
        $msg .= '<div class="row">';
        $msg .= '<div class="col-12 mt-4">';
        $msg .= '<div class="alert alert-dismissible alert-warning">';
        $msg .= '<button type="button" class="btn-close" data-bs-dismiss="alert"></button>';
        $msg .= '<h4 class="alert-heading">Avviso!</h4>';
        $msg .= '<p>' . $str_msg . '</p>';
        $msg .= '</div>';
        $msg .= '</div>';
        $msg .= '</div>';
        $msg .= '</div>';

        return $msg;
    }

    function mail_text($to, $subject, $from, $text)
    {
        // da completare
        return false;
        
    }

    function mail_html($to, $subject, $from, $html)
    {
        // da completare
        return false;
        
    }

    // GET
    if ($_SERVER["REQUEST_METHOD"] == "GET") {

        // Visualizzo l'esito della richiesta
        if (isset($_GET["msg"])) {
            $msg = get_msg_alert($_GET["msg"]);
            echo $msg;
        }
    }

    // POST
    if ($_SERVER["REQUEST_METHOD"] == "POST") {

        // Variabili del form
        $form_email = $_POST["form_email"];
        $form_nominativo = $_POST["form_nominativo"];
        $form_note = $_POST["form_note"];

        // Invio del form - messaggio text
        if ($_REQUEST['btn_submit'] == "messaggio_text") {
            if (
                required_email($form_email) == CONST_ERROR ||
                required_field($form_nominativo) == CONST_ERROR ||
                required_field($form_note) == CONST_ERROR
            ) {
                $msg = get_msg_alert("Si prega di completare i campi obbligatori. Grazie.");
                echo $msg;
            } else {
                // Invio l'email
                $email_text = "MESSAGGIO IN TESTO SEMPLICE \r\n\n";
                $email_text .= "Salve, qualcuno ti ha scritto dal seguente sito:\r\n";
                $email_text .= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] . "\r\n\n";

                foreach ($_POST as $item => $value) {
                    // da completare
                }

                $to = EMAIL_TO;
                $subject = "Email inviata da " . $form_nominativo;
                $from = $form_email;
                $text = $email_text;


                if (mail_text($to, $subject, $from, $text) == true) {
                    redirect($_SERVER['PHP_SELF'], 'Email inviata correttamente. Grazie.');
                } else {
                    redirect($_SERVER['PHP_SELF'], 'Email non inviata correttamente. Riprovare.');
                }
            }
        }

        // Invio del form - messaggio html
        if ($_REQUEST['btn_submit'] == "messaggio_html") {
            if (
                required_email($form_email) == CONST_ERROR ||
                required_field($form_nominativo) == CONST_ERROR ||
                required_field($form_note) == CONST_ERROR
            ) {
                $msg = get_msg_alert("Si prega di completare i campi obbligatori. Grazie.");
                echo $msg;
            } else {
                // Invio l'email
                $email_html = "<h3>";
                $email_html .= "MESSAGGIO IN HTML";
                $email_html .= "</h3>";
                $email_html .= "<hr>";
                $email_html .= "Salve, qualcuno ti ha scritto dal seguente sito:<br>";
                $email_html .= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] . "<br><br>";

                foreach ($_POST as $item => $value) {
                    // da completare
                }

                $to = EMAIL_TO;
                $subject = "Email inviata da " . $form_nominativo;
                $from = $form_email;
                $html = $email_html;

                // da completare
                // per mantenere il testo a capo


                if (mail_html($to, $subject, $from, $html) == true) {
                    redirect($_SERVER['PHP_SELF'], 'Email inviata correttamente. Grazie.');
                } else {
                    redirect($_SERVER['PHP_SELF'], 'Email non inviata correttamente. Riprovare.');
                }
            }
        }
    }

    ?>

    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="py-5 text-center">
                    <h2>Contattami</h2>
                    <p class="lead">Invio di una email in formato testo o html</p>
                </div>

                <form id="form" name="form" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">

                    <fieldset>
                        <legend>Campi obbligatori</legend>
                        <div class="row">
                            <div class="form-group col-md-6 mb-3">
                                <label for="form_email">Email</label>
                                <input type="text" class="form-control" id="form_email" name="form_email" aria-describedby="email" placeholder="Email...">
                                <small class="form-text text-muted">Ti risponderemo a questa email.</small>
                            </div>
                            <div class="form-group col-md-6 mb-3">
                                <label for="form_password">Nominativo</label>
                                <input type="text" class="form-control" id="form_nominativo" name="form_nominativo" placeholder="Nome e cognome...">
                                <small class="form-text text-muted">Inserisci nome e cognome.</small>
                            </div>
                        </div>


                        <div class="row">
                            <div class="form-group col-md-12 mb-3">
                                <label for="form_note">Note</label>
                                <textarea class="form-control" id="form_note" name="form_note" rows="10"></textarea>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="row">
                                <div class="col-6 d-grid">
                                    <button type="submit" name="btn_submit" value="messaggio_html" class="btn btn-success">Invia messaggio in HTML</button>
                                    <div class="form-text">Invia un messaggio formattato con tag HTML</div>
                                </div>
                                <div class="col-6 d-grid">
                                    <button type="submit" name="btn_submit" value="messaggio_text" class="btn btn-secondary">Invia messaggio in formato testo</button>
                                    <div class="form-text">Invia un messaggio come semplice testo</div>
                                </div>
                            </div>
                        </div>

                    </fieldset>

                </form>

            </div>
        </div>
    </div>


    <!-- Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>

Entrambe le funzioni, mail_text() e mail_html(), dovranno usare la funzione incorporata mail() del PHP. Le due funzioni devono prevedere che:

  • entrambe le funzioni debbano restituire un valore booleano true o false;
  • l'intestazione dell'email debba contenere un content-type di tipo text o html a seconda dei casi, riportando anche la versione del PHP;
  • si scelga il charset adatto per la codifica corretta dei caratteri accentati;
  • il testo scritto a capo nella textarea debba essere riportato correttamente anche nel contenuto dell'email;

Ricordatevi anche di completare i due cicli foreach che si occupano di processare i dati del form. Nella versione html ogni campo del form dovrà essere evidenziato in grassetto a differenza della versione testuale che non richiederà nessuna formattazione. Per maggiori chiarimenti guardate il risultato delle immagini in allegato.

Se volete fare delle prove di invio, in ambiente locale, dovete installare delle librerie apposite come PHP_Mailer oppure potete provare lo script su un sito di prova. Se utilizzate Windows c'è anche una comodissima e leggerissima libreria per l'invio delle email. Si chiama SendMail. Per questo esempio è stato utilizzato WampServer e SendMail.

Per configurare correttamente l'invio dell'email dobbiamo intervenire su questi parametri

  • smtp_sever: nome dell'host SMTP; ad esempio smtp.gmail.com
  • smtp_port: numero della porta
  • auth_username: username SMTP
  • auth_password: password SMTP

Per prima cosa scarichiamo SendMail e copiamo la cartella in C:\Wamp64. Apriamo il file di configurazione sendmail.ini

Configurazione SenMail in PHP

All'interno del file, dobbiamo trovare i seguenti parametri e modificarli con i nostri dati. In questo caso abbiamo ipotizzato Gmail di Google:

  • smtp_server= smtp.gmail.com
  • smtp_port=587
  • error_logfile=error.log
  • debug_logfile=debug.log
  • auth_username=yourgmail@gmail.com
  • auth_password=yourgmailpassword

Fatto questo, non ci resta che andare nel file di configurazione di php.ini, facilmente accessibile dal pannello di controllo di WampServer:

php.ini

Aperto il file, dobbiamo trovare i seguenti parametri e modificarli con i nostri dati:

  • SMTP=smtp.gmail.com
  • smtp_port=587
  • sendmail_from = "yourmail@gmail.com"
  • sendmail_path = "C:\wamp64\sendmail\sendmail.exe"

Se stiamo usando Gmail di Google dobbiamo rivedere le impostazioni di sicurezza e comunicare a Google di consentire l'accesso alle app non sicure. Per fare ciò, andare sul proprio account Google e alla scheda sicurezza, modificare come da immagine:

Account Google - Abilitare app non sicure

Perfetto! Adesso potete inviare l'email localmente e fare i dovuti test. Guardate le immagini in fondo all'articolo e verificate se avete svolto correttamente l'esercizio. Buon lavoro e soprattutto divertitevi.

Nel file finish.php, si deve solo specificare l'email del destinatario nella costante EMAIL_TO per testarne il funzionamento.

finish.php

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Invio email in formato testo e html</title>

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
</head>

<body>

    <?php

    // Costanti

    // da completare
    define("EMAIL_TO", '');

    define("CONST_ERROR", 'error');

    // Funzioni
    function redirect($page,$msg){
        header("location:" . $page . '?msg=' . $msg);
        exit();
    }

    function required_field($field)
    {
        $res = !empty($field) ? $field : CONST_ERROR;

        return $res;
    }

    function required_email($email)
    {
        $res = !empty($email) && filter_var($email, FILTER_VALIDATE_EMAIL) ? $email : CONST_ERROR;

        return $res;
    }

    function get_msg_alert($str_msg)
    {
        $msg = '<div class="container">';
        $msg .= '<div class="row">';
        $msg .= '<div class="col-12 mt-4">';
        $msg .= '<div class="alert alert-dismissible alert-warning">';
        $msg .= '<button type="button" class="btn-close" data-bs-dismiss="alert"></button>';
        $msg .= '<h4 class="alert-heading">Avviso!</h4>';
        $msg .= '<p>' . $str_msg . '</p>';
        $msg .= '</div>';
        $msg .= '</div>';
        $msg .= '</div>';
        $msg .= '</div>';

        return $msg;
    }

    function mail_text($to, $subject, $from, $text)
    {
        // da completare
        $headers  = 'MIME-Version: 1.0' . "\r\n";
        $headers .= 'Content-Type: text/plain;charset=utf-8' . "\r\n";
        $headers .= 'From: ' . $from . "\r\n" . 'Reply-To: ' . $from . "\r\n" . 'X-Mailer: PHP/' . phpversion();

        $result = mail($to, $subject, $text, $headers);
        if ($result) {
            return true;
        } else {
            return false;
        }
    }

    function mail_html($to, $subject, $from, $html)
    {
        // da completare
        $headers  = 'MIME-Version: 1.0' . "\r\n";
        $headers .= 'Content-type: text/html;charset=utf-8' . "\r\n";
        $headers .= 'From: ' . $from . "\r\n" . 'Reply-To: ' . $from . "\r\n" . 'X-Mailer: PHP/' . phpversion();

        $result = mail($to, $subject, $html, $headers);
        if ($result) {
            return true;
        } else {
            return false;
        }
    }

    // GET
    if ($_SERVER["REQUEST_METHOD"] == "GET") {

        // Visualizzo l'esito della richiesta
        if (isset($_GET["msg"])) {
            $msg = get_msg_alert($_GET["msg"]);
            echo $msg;
        }
    }

    // POST
    if ($_SERVER["REQUEST_METHOD"] == "POST") {

        // Variabili del form
        $form_email = $_POST["form_email"];
        $form_nominativo = $_POST["form_nominativo"];
        $form_note = $_POST["form_note"];

        // Invio del form - messaggio text
        if ($_REQUEST['btn_submit'] == "messaggio_text") {
            if (
                required_email($form_email) == CONST_ERROR ||
                required_field($form_nominativo) == CONST_ERROR ||
                required_field($form_note) == CONST_ERROR
            ) {
                $msg = get_msg_alert("Si prega di completare i campi obbligatori. Grazie.");
                echo $msg;
            } else {
                // Invio l'email
                $email_text = "MESSAGGIO IN TESTO SEMPLICE \r\n\n";
                $email_text .= "Salve, qualcuno ti ha scritto dal seguente sito:\r\n";
                $email_text .= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] . "\r\n\n";

                foreach ($_POST as $item => $value) {
                    // da completare
                    if ("btn_submit" == $item) continue;
                    $email_text .=  $item . ": "  . $value . "\r\n";
                }

                $to = EMAIL_TO;
                $subject = "Email inviata da " . $form_nominativo;
                $from = $form_email;
                $text = $email_text;


                if (mail_text($to, $subject, $from, $text) == true) {
                    redirect($_SERVER['PHP_SELF'], 'Email inviata correttamente. Grazie.');
                } else {
                    redirect($_SERVER['PHP_SELF'], 'Email non inviata correttamente. Riprovare.');
                }
            }
        }

        // Invio del form - messaggio html
        if ($_REQUEST['btn_submit'] == "messaggio_html") {
            if (
                required_email($form_email) == CONST_ERROR ||
                required_field($form_nominativo) == CONST_ERROR ||
                required_field($form_note) == CONST_ERROR
            ) {
                $msg = get_msg_alert("Si prega di completare i campi obbligatori. Grazie.");
                echo $msg;
            } else {
                // Invio l'email
                $email_html = "<h3>";
                $email_html .= "MESSAGGIO IN HTML";
                $email_html .= "</h3>";
                $email_html .= "<hr>";
                $email_html .= "Salve, qualcuno ti ha scritto dal seguente sito:<br>";
                $email_html .= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] . "<br><br>";

                foreach ($_POST as $item => $value) {
                    // da completare
                    if ("btn_submit" == $item) continue;
                    $email_html .=  "<b>" . $item . "</b>: "  . $value . "<br>";
                }

                $to = EMAIL_TO;
                $subject = "Email inviata da " . $form_nominativo;
                $from = $form_email;
                $html = $email_html;

                // da completare
                // per mantenere il testo a capo
                $html = str_replace("\n", "<br>", $html);


                if (mail_html($to, $subject, $from, $html) == true) {
                    redirect($_SERVER['PHP_SELF'], 'Email inviata correttamente. Grazie.');
                } else {
                    redirect($_SERVER['PHP_SELF'], 'Email non inviata correttamente. Riprovare.');
                }
            }
        }
    }

    ?>

    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="py-5 text-center">
                    <h2>Contattami</h2>
                    <p class="lead">Invio di una email in formato testo o html</p>
                </div>

                <form id="form" name="form" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">

                    <fieldset>
                        <legend>Campi obbligatori</legend>
                        <div class="row">
                            <div class="form-group col-md-6 mb-3">
                                <label for="form_email">Email</label>
                                <input type="text" class="form-control" id="form_email" name="form_email" aria-describedby="email" placeholder="Email...">
                                <small class="form-text text-muted">Ti risponderemo a questa email.</small>
                            </div>
                            <div class="form-group col-md-6 mb-3">
                                <label for="form_password">Nominativo</label>
                                <input type="text" class="form-control" id="form_nominativo" name="form_nominativo" placeholder="Nome e cognome...">
                                <small class="form-text text-muted">Inserisci nome e cognome.</small>
                            </div>
                        </div>


                        <div class="row">
                            <div class="form-group col-md-12 mb-3">
                                <label for="form_note">Note</label>
                                <textarea class="form-control" id="form_note" name="form_note" rows="10"></textarea>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="row">
                                <div class="col-6 d-grid">
                                    <button type="submit" name="btn_submit" value="messaggio_html" class="btn btn-success">Invia messaggio in HTML</button>
                                    <div class="form-text">Invia un messaggio formattato con tag HTML</div>
                                </div>
                                <div class="col-6 d-grid">
                                    <button type="submit" name="btn_submit" value="messaggio_text" class="btn btn-secondary">Invia messaggio in formato testo</button>
                                    <div class="form-text">Invia un messaggio come semplice testo</div>
                                </div>
                            </div>
                        </div>

                    </fieldset>

                </form>

            </div>
        </div>
    </div>


    <!-- Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>
Mettiti alla prova: invio di una email in formato testo e html
Mettiti alla prova: invio di una email in formato testo e html
Mettiti alla prova: invio di una email in formato testo e html