kratos
Goto Top

Mit Nodemailer SMTP Mails mit eigener HTML Form versenden?

Hallo zusammen,

ich versuche schon seit längerem meine HTML-Form mit Nodemailer zu versenden, was nicht funktioniert, also überhaupt keine Reaktion.

Meine Frage ist, ob ich bei der HTML-Form oder bei dem Nodemailer Javascript etwas noch anpassen muss, damit er die Mail zum Testzweck versendet?

Andere Frage ist, kann man das Lokal machen oder ist es besser über Domain Anbieter zu testen, wenn die Website hochgeladen ist?

Über Tipps und Hilfestellungen bzw. Lösungsansätze würde ich mich freuen.


HTML Form:

<form class="my-form" action=""  method="POST" >  
         
         <div class="container">    
         
         
                 <select>
                   <option selected>-- was darf es sein ? --</option>
                   <option id="Hochzeit"  >Hochzeit</option>  
                   <option id="Paarshooting" >Paarshooting</option>  
                     <option id="Babybauchshooting" >Babybauchshooting</option>  
                       
                 </select>
               
         
                 <p><label for="NameVorname">Name und Vorname:</label>  
                     <input id="NameVorname" type='text'  required />  
                 </p>
         
                 <p><label for="email">Email:</label>  
                     <input id="email" type='email'  required />  
                 </p>
         
                 <p><label for="Location">Location:</label>  
                     <input id="Location" type='text'  />  
                 </p>
         
                 <p><label for="Telefonnummer">Telefonnummer:</label>  
                     <input id="Telefonnummer" type='tel' />  
                 </p>
         
                 <p><label for="Wunschtermin">Wunschtermin:</label>   
                 <input id="Wunschtermin" type='date' /></p>  
         
                 <label>Erzählt mir etwas über euch ?</label>
                 <textarea id="message" required placeholder="Hier bitte Schreiben" ></textarea>  
                 

         
             <p><label>Wie seit ihr auf mich aufmerksam geworden ?</label> </p>

                        
                              <p><input type='radio' id="radio1" name="radio-group" />  
                             <label for="radio1">Facebook</label>  
                             
                          
         
                        
                             <input type='radio' id="radio2" name="radio-group" />  
                             <label for="radio2">Instagram</label>  
                            
                     
         
                       
                             <input type='radio' id="radio3" name="radio-group"  />  
                             <label for="radio3">Google</label>  
                             
                
         
                       
                             <input type='radio' id="radio4" name="radio-group" />  
                             <label for="radio4">Empfehlung</label>  
                            
                      
         
                 
                             <input type='radio' id="radio5" name="radio-group"  />  
                             <label for="radio5">Sonstige</label>  
             </p>

                         <div>
                             <input id="datenschutz" type='checkbox'  required /><label for="datenschutz"> Ich habe die Datenschutzerklärung zur Kenntnis genommen und bin damit einverstanden, dass meine oben eingegebenen Daten an ************** gesendet werden.</label>  
                             
                         </div>         
               
                   
                 <div class="grid grid-3">  
                    
                   <button class="btn-grid" type="submit"  disabled >  
                     <span class="back">  
                       <img src="Icons/iconmonstr-email-9.svg" alt="">  
                     </span>
                     <span class="front">Senden</span>  
                   </button>
                   <button class="btn-grid" type="reset" disabled>  
                     <span class="back">  
                       <img src="Icons/iconmonstr-eraser-2.svg" alt="">  
                     </span>
                     <span class="front">Reset</span>  
                   </button> 
                     
                     <div class="required-msg">Pflichtfeld</div>  
                 </div>
               
         
         
         
         </div>
             </form>  
 

Nodemailer Javascript:

var nodemailer = require('nodemailer');  

// Erstelle einen Transporter für den SMTP-Versand

var transporter = nodemailer.createTransport({
  host: 'smtps.******.de',   // Hier musst du den Hostnamen deines SMTP-Servers eingeben  
  port: 465,   // Hier musst du den Port deines SMTP-Servers eingeben
  secure: true,   // Wenn du TLS verwendest, musst du dies auf true setzen
  auth: {
    user: '***************',   // Hier musst du deine E-Mail-Adresse eingeben  
    pass: '**************'    // Hier musst du das Passwort für deine E-Mail-Adresse eingeben  
  }
});

// Event Listener für "submit"-Event hinzufügen 
 var form = document.getElementById('.my-form').addEventListener('submit'){  
     // Standardverhalten des Formulars unterbinden

     // HTML-Form-Daten abrufen
     var name = document.getElementById('NameVorname').value;  
     var email = document.getElementById('email').value;  
     var location = document.getElementById('Location').value;  
     var phone = document.getElementById('Telefonnummer').value;  
     var date = document.getElementById('Wunschtermin').value;  
     var message = document.getElementById('message').value;  

var selectedRadio;
if (req.body.radio1) {
  selectedRadio = 'Facebook';  
} else if (req.body.radio2) {
  selectedRadio = 'Instagram';  
} else if (req.body.radio3) {
  selectedRadio = 'Google';  
} else if (req.body.radio4) {
  selectedRadio = 'Empfehlung';  
} else {
  selectedRadio = 'Sonstige';  
}

var selectedOption = req.body.selectOption; // Hier speicherst du den Wert der ausgewählten Option

// Setze die Optionen für die E-Mail
var mailOptions = {
  from: email, // Hier musst du den Absender der E-Mail eingeben
  to: '*********************', // Hier musst du die E-Mail-Adresse des Empfängers eingeben  
  subject: 'Betreff:'+ req.body.selectOption, // Hier kannst du den Betreff der E-Mail festlegen  
  html:  '<p>Name und Vorname: ' + name + '</p>' +  
  '<p>Email: ' + email + '</p>' +  
  '<p>Location: ' + location + '</p>' +  
  '<p>Telefonnummer: ' + phone + '</p>' +  
  '<p>Wunschtermin: ' + date + '</p>' +  
  '<p>Aufmerksamkeit: ' + selectedRadio + '</p>' + // Hier fügst du den Wert des ausgewählten Radio-Buttons ein  
  '<p>Nachricht: ' + message + '</p>'  

        
};

transporter.sendMail(mailOptions,function (error, info){
    if (error) {
      console.log(error);
    } else {
      console.log('Email sent: ' + info.response);  
      // Benachrichtigung anzeigen
      var notification = document.getElementById('notification');  
      notification.innerHTML = 'E-Mail erfolgreich versendet!';  
    }
  });
});

PS. Die E-Mail soll alles beinhalten, was ausgefüllt und ausgewählt wurde.

VG,

Kratos

Content-ID: 6167725620

Url: https://administrator.de/contentid/6167725620

Ausgedruckt am: 21.11.2024 um 20:11 Uhr

LordGurke
LordGurke 01.03.2023 aktualisiert um 01:46:07 Uhr
Goto Top
Nodemailer ist ein Modul für node.js, also eine auf Serverseite ausgeführte Sprache. Was gut ist, denn sonst müsstest du der ganzen Welt eben diese SMTP-Zugangsdaten, die du hier aus gutem Grundzensiert hast, ausliefern.
Dein JS-Code sieht aber so aus, als erwartest du, dass er im Browser ausgeführt wird.

Wie läuft dieser Code aktuell bei dir?

EDIT: Deine Eingangsfrage klingt, als hättest du einen normalen Webspace, der mit >99% Wahrscheinlichkeit kein node.js ausführt, dafür aber vermutlich PHP kann.
Kratos
Lösung Kratos 01.03.2023 um 11:15:47 Uhr
Goto Top
Hi @LordGurke,

Stimmt daran habe ich noch nicht gedacht, das bedeutet, dass ich dann es über PHPMailer machen muss.

Hast du zufällig ein Beispiel dafür, ist ein bisschen her, wo ich es mal gemacht habe?

VG,

Kratos