¿Cómo enviar un correo electrónico desde JavaScript?

En este artículo, aprenderemos cómo enviar correo utilizando el Protocolo simple de transferencia de correo, que es una biblioteca de JavaScript gratuita. Básicamente se usa para enviar correos electrónicos, por lo que solo funciona para correos electrónicos salientes. Para poder enviar correos electrónicos, debe proporcionar el servidor SMTP correcto cuando configure su cliente de correo electrónico. La mayoría de los sistemas de Internet utilizan SMTP como método para transferir correo de un usuario a otro. Es un protocolo push. Para usar SMTP, debe configurar su Gmail. Debe cambiar dos configuraciones de su cuenta de Gmail desde la cual está enviando el correo, es decir

  • Revocar la verificación en dos pasos
  • Habilitación de aplicaciones menos seguras para acceder a Gmail. Puede hacerlo fácilmente haciendo clic en el enlace Habilitar

Después de esto, simplemente cree un archivo HTML e incluya SMTP en su etiqueta <script></script>: 

<script src="https://smtpjs.com/v3/smtp.js"></script>

A continuación se muestra el archivo HTML que deberá ejecutar para enviar el correo. 

Nombre de archivo: index.html

html

<!DOCTYPE html>
<html>
 
<head>
  <title>Send Mail</title>
  <script src=
    "https://smtpjs.com/v3/smtp.js">
  </script>
 
  <script type="text/javascript">
    function sendEmail() {
      Email.send({
        Host: "smtp.gmail.com",
        Username: "sender@email_address.com",
        Password: "Enter your password",
        To: 'receiver@email_address.com',
        From: "sender@email_address.com",
        Subject: "Sending Email using javascript",
        Body: "Well that was easy!!",
      })
        .then(function (message) {
          alert("mail sent successfully")
        });
    }
  </script>
</head>
 
<body>
  <form method="post">
    <input type="button" value="Send Email"
        onclick="sendEmail()" />
  </form>
</body>
 
</html>

Simplemente haga clic en el botón y se enviará el correo:

Verá una ventana emergente a continuación si el correo se ha enviado correctamente.

 

Ahora la pregunta es qué sucede si tiene múltiples receptores. En ese caso, no tiene que hacer nada, solo configure su función sendMail() como se describe a continuación:

to: 'first_username@gmail.com, second_username@gmail.com',

Descansen todos seamos iguales. Si desea enviar texto con formato HTML al receptor, debe agregar el siguiente código en su función de correo:

html: "<h1>GeeksforGeeks</h1>
<p>A computer science portal</p>"

Por último, para enviar un archivo adjunto, simplemente escriba el siguiente código en la función sendMail():

Attachments : [{
    name : "File_Name_with_Extension",
    path:"Full Path of the file"
}]

Entonces, el código JavaScript final después de la configuración anterior se verá así:

Nombre de archivo: index.html

html

<!DOCTYPE html>
<html>
 
<head>
  <title>Sending Mail</title>
  <script src="https://smtpjs.com/v3/smtp.js"></script>
  <script type="text/javascript">
    function sendEmail() {
      Email.send({
        Host: "smtp.gmail.com",
        Username: "sender@email_address.com",
        Password: "Enter your password",
        To: 'receiver@email_address.com',
        From: "sender@email_address.com",
        Subject: "Sending Email using javascript",
        Body: "Well that was easy!!",
        Attachments: [
          {
            name: "File_Name_with_Extension",
            path: "Full Path of the file"
          }]
      })
        .then(function (message) {
          alert("Mail has been sent successfully")
        });
    }
  </script>
</head>
 
<body>
  <form method="post">
    <input type="button" value="Send Mail"
        onclick="sendEmail()" />
  </form>
</body>
 
</html>

JavaScript es mejor conocido por el desarrollo de páginas web, pero también se usa en una variedad de entornos que no son de navegador. Puede aprender JavaScript desde cero siguiendo este tutorial de JavaScript y ejemplos de JavaScript .

HTML es la base de las páginas web y se utiliza para el desarrollo de páginas web mediante la estructuración de sitios web y aplicaciones web. Puede aprender HTML desde cero siguiendo este tutorial de HTML y ejemplos de HTML .

Publicación traducida automáticamente

Artículo escrito por MohdArsalan y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *