Question

我尝试寻找不同的答案，但是它们没有用。尝试发送时，我的gmail帐户中没有收到电子邮件，我只是在Ethereal帐户中收到了电子邮件。

这是我的服务器代码：

const express = require('express');
const path = require('path');
const cons = require('consolidate');
const bodyParser = require('body-parser');
const nodemailer = require("nodemailer");
const app = express();

app.engine('html', cons.swig)
app.set('../public', path.join(__dirname, 'public'));

app.use('../src/css', express.static(path.join(__dirname, 'src/css')));
app.use('../src/js', express.static(path.join(__dirname, 'src/js')));

app.use(bodyParser.urlencoded({ extended: false}));
app.use(bodyParser.json());

app.post('/send',(req,res) => {
    const output = `
        <p>name of client: ${req.body.name}</p>
    `;

    let transporter = nodemailer.createTransport({
        host: "smtp.ethereal.email",
        port: 587,
        secure: false,
        auth: {
        user: "*****@ethereal.email",
        pass: "********"
        },
        tls: {
            rejectUnauthorized: false
        }
    });

    let mailOptions = {
        from: `${req.body.email}`,
        to: "******@gmail.com",
        subject: "Node contact request",
        text: "Hello world?",
        html: output
    };

    transporter.sendMail(mailOptions, (error, info) => {
        if(error) {
            return console.log(error);
        }
        console.log("Message sent: %s", info.messageId);
        console.log("Preview URL: %s", nodemailer.getTestMessageUrl(info));

        res.render('index')
    });
});

app.listen(5000);

我正在为我的前端（电子商务）使用react app，我希望在发送电子邮件后，客户端将看到一条消息，指出“电子邮件已发送”（位置对于现在）。提交表格后如何处理？现在，客户端将定向到localhost：5000 / send，而不是停留在同一页面上。

这是我的反应代码：

import React from 'react';

const contact = () => {
    return (
    <form className="contact" action="http://localhost:5000/send" method="post">
        <div className="contact-topFields">
            <div className="contact-topFields-email">
                <input 
                    className="contact-topFields-email-input" 
                    type="email" 
                    name="email" 
                    required/>
                <ion-icon id="email-icon" name="mail"></ion-icon>
                <p className="contact-topFields-email-text">Email</p>
            </div>
            <div className="contact-topFields-name">
                <input 
                    className="contact-topFields-name-input" 
                    type="text" 
                    name="name" 
                    required/>
                <ion-icon id="name-icon" name="person"></ion-icon>
                <p className="contact-topFields-name-text">Name</p>
            </div>
        </div>
        <div className="contact-bottomFields">
            <div className="contact-bottomFields-phone">
                <input 
                    className="contact-bottomFields-phone-input" 
                    type="text" 
                    name="phonenumber" 
                    required/>
                <ion-icon id="phone-icon" name="call"></ion-icon>
                <p className="contact-topFields-phone-text">phone</p>
            </div>
        </div>
        <div className="contact-text">
            <textarea className="contact-text-textarea" name="message" required></textarea>
        </div>
        <button className="contact-submitButton" type="submit">send </button>
    </form>

    )
}

export default contact;

Answer 1

为防止将页面定向到localhost：5000 / send：

为了在保持用户视图不变的同时触发发送电子邮件，您可能需要覆盖表单的提交功能。

例如，您可能需要在JSX代码中执行此操作：

<form className="contact" onSubmit={{this.handleSubmit}}>
<- whatever inside form ->
</form>

然后您可能想定义一个函数handleSubmit：

function handleSubmit (evt) {
  evt.preventDefault() // this is used to prevent ui from being directed

  // Do http request here, use a http agent such as fetch(), axios() etc etc. 

}

通过nodemailer向多个收件人发送电子邮件不起作用

1 个答案: