Cómo enviar un correo electrónico desde un formulario de contacto HTML

¿Qué significa este código?
Primero comprobamos si el mensaje fue rellenado y si lo es, el código dentro de IF se ejecutará, lanzando efectivamente la función mail() . "mail" envía el formulario completado como un correo electrónico a "[email protected]", y el asunto es el que sigue.

Con esto, tenemos el código realmente muy básico, sin ninguna validación o comprobación de seguridad, seguramente podemos hacerlo mejor que esto.

Ahora recordemos que tenemos elementos HTML de entrada en nuestro formulario ¿verdad? Cada uno de los campos que queremos procesar, tiene un nombre de parámetro y trabajaremos con ellos en sendmail.php. Los datos rellenados por un usuario se convertirán en una variable con el nombre del input del que procede. Para que esto funcione, por supuesto los parámetros de nombre deben tener "nombres" únicos, tenga en cuenta que sólo tenemos uno de cada uno - name=”name”, name=”email”, name=”message” , etc.
Como hemos dicho estas variables están todas empaquetadas en una variable superglobal de PHP llamada $_POST . Si añades esto al sendmail.php, al rellenar el formulario, deberías ver los datos que se están enviando.

";
    print_r($_POST);
echo "

Ahora configuramos algunas variables para romper el $_POST para trabajar con los datos. Ahora tenemos nuestro código así>

if($_POST["message"]) {
    $name = $_POST["name"];
    $visitorEmail = $_POST["email"];
    $message = $_POST["message"];
    $OUR_MAIL = '[email protected]';
    
$errors = "";
//NORMAL OPERATION - NO ERRORS        
    if(empty($errors)){
        $EMAIL_SUBJECT = "New Form Contact From " . $name . " @ Your Portfolio Website!";
        $emailBody = "User name: " . $name . "rn".
                     "User email: " . $visitorEmail . "rn".
                     "User message: " . $message . "rn";
 
        $TARGET_EMAIL = "[email protected]";
//HEADERS
        $headers = "From: " . $OUR_MAIL . "rn";
        $headers .= "Reply-To: " . $visitorEmail . "rn";
}}
?>

(Nota: rn hará el salto de línea - el texto estructurado de la línea)
Por ahora, no tenemos ninguna validación de código, ni función de correo real, pero eso va a cambiar cuando lo mostremos en el código a continuación. Las cabeceras son opcionales, sirven para cosas como BCC, direcciones Reply-To, y cosas así.

Mail Function

PHP mail es la función PHP incorporada que se utiliza para enviar correos electrónicos desde scripts PHP.

mail($TARGET_EMAIL, $EMAIL_SUBJECT, $emailBody, $headers)

Añadimos la resolución de éxito o fracaso de la función de correo, incluso se mostrará el mensaje del usuario según cuál sea el resultado. Lo último será la redirección a la página index.html, refrescando efectivamente la ventana.

$success = mail($TARGET_EMAIL, $EMAIL_SUBJECT, $emailBody, $headers);
//SUCCESS OR FAIL FOR CORRECT TEXT
if ($success){
        ?>
      
      
      
      









XAMPP settings





Si por alguna razón ve este mensaje - Failed to connect to mailserver at "localhost".. , ahora le daremos algunas pistas sobre cómo resolver este problema.



PHP debe ser configurado correctamente en el archivo php.ini con los detalles de cómo su sistema envía el correo electrónico.

Abra el archivo php.ini en el directorio de XAMPP y encuentre la sección titulada [mail function].



Los usuarios de Windows deben asegurarse de que la directiva llamada SMTP que define la dirección de su servidor de correo electrónico está configurada como SMTP = smtp.gmail.com  . La segunda se llama sendmail_from  que define su propia dirección de correo electrónico, por lo que hay que establecer a la dirección de gmail EXACTAMENTE como tenemos la variable $OUR_MAIL.



Otra cosa importante es configurar sendmail.ini para las notificaciones de correo electrónico. En PHP.ini localiza sendmail_path y sustitúyelo por sendmail_path = ""C:xamppsendmailsendmail.exe" -t"  . Obviamente la unidad y la ruta deben apuntar al sendmail.exe, asegúrese de que así sea dónde está en tu sistema.



Edita el archivo sendmail.ini en el subdirectorio sendmail de tu directorio de instalación de XAMPP. Dentro de este archivo, encuentre la sección [sendmail] y reemplace estas líneas. Los valores deberían ser los siguientes>

Smtp_server = smtp.gmail.com

Smtp_port = 465

Smtp_ssl = auto

Error_logfile = error.log

Auth_username = [email protected]

Auth_password = gmail password 

Después de esto, reinicie el servidor Apache utilizando el panel de control de XAMPP.



Gmail Email Client

Además, como último consejo, el uso del servidor SMTP de Gmail para el envío de correos electrónicos sólo funciona si has permitido que aplicaciones menos seguras accedan a tu cuenta (si no utilizas la verificación en dos pasos).

Y en la configuración también habilita el acceso IMAP.

  

Validar los datos del formulario con PHP



Ya casi llegamos al final. La cosa es que podemos ser víctimas de alguna malevolencia cada vez que pongamos algún formulario, debemos tener más seguridad configurada. Vamos a centrarnos en el back-end, sobre cómo validar formularios HTML escribimos en el otro artículo, allí puedes obtener información sobre cómo hacer el código Javascript del front-end.

Así que modificamos de nuevo nuestro código. Recuerda que tenemos nuestro código comprobando si hay errores, pero aún no han sido capturados. Ahora sólo cuando no existan errores el código procederá a la función mail() .

//EMPTY SPACE VALIDATION
    if(empty($name) || empty($visitorEmail) || empty($message)){
        $errors .= "n All fields are required";
    }
 
    //NAME VALIDATION
    $string_exp = "/^[A-Za-z .'-]+$/";
    if (!preg_match($string_exp, $name)) {
        $error_message .= "n The Name you entered does not appear to be valid.";
    }
 
    //EMAIL REGEX VALIDATION
    $email_exp = "/^[_a-z0-9-]+(.[_a-z0-9-]+)*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$/i";
    if (!preg_match($email_exp, $visitorEmail)){
        $errors .= "n Invalid email address";
    }






Bien, hasta ahora tenemos validación SI el usuario envió el formulario, y tenemos validación si faltan campos o datos que no queremos. A continuación, tenemos que deshacernos de los potenciales exploits de cross-site scripting (XSS), debemos evitar que los atacantes inyecten script del lado del cliente en nuestro código.


	
    Quitar los caracteres innecesarios (espacio extra, tabulación, nueva línea) de los datos de entrada del usuario (con la función PHP  trim() ), también nos deshacemos de las etiquetas HTML en este paso.
	
    Eliminar las barras invertidas () de los datos introducidos por el usuario (con la función PHP stripslashes())
	
    Usando la función htmlspecialchars() esta función convertirá los caracteres especiales en entidades para evitar que los navegadores los usen como elementos HTML. Esto es útil para evitar que el código se ejecute cuando queremos hacerlo, por ejemplo si el usuario intenta enviar o ejecutar su código puesto en el campo de texto. Esto no elimina los caracteres, pero ya no se manejarán como código HTML, sino como texto plano.
	

	se convertirá en:

	
<script>location.href('http://www.facebook.com')</script>.
	
	
    Por último definimos una función para reemplazar el carácter vacío de todo el texto innecesario que no queremos que aparezca en nuestro buzón, nótese que para ello hemos movido todo el texto a minúsculas.


Ahora, podemos comprobar todos los datos entrantes (todos nuestros campos de formulario) que estamos escribiendo en variables con la función test_input() , y con la función quitaremos los datos de intentos de hackers potencialmente dañosos.

//TEST INPUT DATA FOR INJECTION
function testInputData($data){
  $data = strip_tags(trim($data));    //trim extra space, tab, newline from the user input data
  $data = stripslashes($data);        //Remove backslashes () from the user input data
  $data = htmlspecialchars($data);    //data would be saved as HTML escaped code, so safe to display
  $data = preg_replace("([rn])", "", $data); //removes newlines
  $data = cleanString(strtolower($data));      //removing unwanted strings
return $data;
}
 
//Returns empty if encounters any unwanted characters in $inputString
function cleanString($inputString){
  $unwantedChars = array("content-type", "bcc:", "to:", "cc:", "href", "https");
  return str_replace($unwantedChars, "", $inputString);
}




//SEND MAIL CODE
    $name = testInputData($_POST["name"]);
    $visitorEmail = testInputData($_POST["email"]);
    $message = testInputData($_POST["message"]);


PHPMailer

Hablemos de por qué PHPMailer es mejor que el correo nativo de PHP.



PHPMailer es quizás la librería PHP de código abierto más popular para el envío de correos electrónicos y desde su lanzamiento se ha convertido en la favorita de los desarrolladores PHP. Es una alternativa a la función PHP mail() , pero con más flexibilidad para sus necesidades. Por ejemplo, PHPMailer está orientado a objetos, puede usar un servidor SMTP de correo no local, lo cual es mejor que el servidor de correo local de mail()s, puede imprimir mensajes de error cuando el envío de correos electrónicos falla. Y también es utilizado por los populares CMS (sistemas de gestión de contenidos) de PHP como WordPress, Drupal y Joomla.



Así que tenemos que ir al repositorio de Github de PHPMailer y descargarlo como un archivo zip.

Extraer y poner los archivos del directorio src del archivo a nuestro directorio de la aplicación a la carpeta 'mail'.



Para ilustrar cómo se puede utilizar con nuestra cuenta de Gmail, creamos un script totalmente diferente llamado sendmailphpmailer.php, lo enlazamos en el index.html (o index.php si lo tenemos así) en lugar de sendmail.php y añadimos este código dentro>

isSMTP();
//Send using SMTP
$mail->SMTPDebug  = 0;
//0 = off(for production use)/1 = client messages/2 = client and server messages
$mail->Host       = 'smtp.gmail.com';                       
//Set the SMTP server to send through
//$mail->Host = gethostbyname('smtp.gmail.com');              
//if your network does not support SMTP over IPv6
$mail->SMTPSecure = 'tls';                                  
// ssl is deprecated
$mail->SMTPAuth   = true;                                   
//Enable SMTP authentication
$mail->SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS;         
//Enable TLS encryption; `PHPMailer::ENCRYPTION_SMTPS` encouraged
$mail->Port       = 587;                                    
//TCP port to connect to, use 465 for `PHPMailer::ENCRYPTION_SMTPS` above
$mail->SMTPOptions = array(
    'ssl' => array(
    'verify_peer' => false,
    'verify_peer_name' => false,
    'allow_self_signed' => true
    )
);
 
//AUTHENTIFICATION
$mail->Username   = '[email protected]';     //SMTP username
$mail->Password   = 'websiteGmailAccountPassword';           //SMTP password
 
//RECIPIENTS
$mail->setFrom('[email protected]', 'Tibor Kopca Portfolio');        
//From email and name
$mail->addAddress("[email protected]", "Recipient : Tibor Kopca");           
//To address and name
$mail->addReplyTo($visitorEmail, "Reply to " . $name );                          
//Address to which recipient will reply
 
//CC and BCC
//$mail->addCC("[email protected]");
$mail->addCC($visitorEmail, $name);                      
//carbon copy to visitor email address
$mail->addBCC('[email protected]');
 
//CONTENT
$mail->isHTML(false);                                                              
//Send HTML or Plain Text email
$mail->Subject = "New Form Contact From " . $name . " @ Your Portfolio Website!";
$mail->AltBody = "This is the plain text version of the email content";    
// If html emails is not supported by the receiver, show this body
$mail->msgHTML("
Thank you for the message. We will contact you shortly.
 
" .
                "
User name: " . $name . " 
" .
                "User email: " . $visitorEmail . "
" .
                "User message: " . $message . "
" );
 
//ERROR HANDLING AND SEND MAIL
if ($errors) {
//error messages exists - the message shouldnt be send
    echo "Mailer Error: " . $errors;
}else{
    try {
        $mail->send();
        ?>
        
        ErrorInfo; //can return error messages in 43 different languages.
        ?>
        
        












Nota2: al final modificamos la redirección a nuestro index.html con algún código extra para pasar el contenido que queremos en la URL. De esta forma podemos coger ese contenido en la página a la que vamos a redirigir. Para que esto funcione, cambiamos el nombre de index.html a index.php y añadimos este código donde está el elemento HTML del formulario. Básicamente cuando el mensaje se ejecute con éxito, no aparecerá el formulario sino el mensaje que hemos codificado en su lugar.


   
Thank you for the message, I will respond ASAP.
Message failed. Please, contact me by an alternative way.

          
          
          
          
          
          
   





Y este será el resultado cuando todo funcione correctamente.



Validación de formularios en JavaScript



Te aconsejamos que también añadas validación de formularios en el frontend, ya que en este artículo no mostramos ninguna. Si quieres saber cómo se puede hacer, que cubrimos en nuestro otro artículo.



Conclusión



¡Y eso es todo! Hemos cubierto la función mail() incorporada en PHP y la librería PHPMailer como alternativa.

Para este tema hay mucho más que aprender pero esperamos que en este tutorial hayamos proporcionado los fundamentos del envío de correos electrónicos desde el formulario de su sitio web.

La próxima vez escribiremos sobre cómo implementar Whatsapp messenger a nuestro sitio web, así que mantente atento.



Imagen principal por M. H. de Pixabay,

Imágenes y edición por Tibor Kopca