Nodemailer Node express POST issue Github pages Gmail答案

【问题标题】：Nodemailer Node express POST issue Github pages GmailNodemailer Node express POST issue Github pages Gmail
【发布时间】：2020-04-10 15:33:34
【问题描述】：

这里是回购的链接：https://github.com/mcs415/nodemailer-heroku 该 repo 基本上是 Brad Travery 教程的复制品：https://www.youtube.com/watch?v=nF9g1825mwk 节点服务器在 localhost 上工作，但是当我提交时出现 POST 错误，之后我没有得到任何信息。

我开始在网络上搜索 Nodemailer POST 错误，然后我得出的结论可能是快递。我正在使用 Gmail。最初建议使用 Zoho Mail。我使用的是应用程序不太安全的选项，repo 上的代码没有填写密码。我想我会先处理 POST 错误。

我设置了 Heroku，然后尝试通过 CLI 创建应用程序，它看起来不错，然后我得到了一个错误：没有启动脚本，我搜索它并发现在 JSON 文件中包含测试后的一行，然后我的服务器根本没有运行。所以一次一件事。第一个 POST 错误，然后是 Heroku，然后是 GMAIL，可能是 0auth 选项或其他电子邮件帐户。

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Contact Morgan</title>
      <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css" />
      <link rel="stylesheet" href="public/css/style.css">
    </head>
    <body>
      <div class="container">
        <h1 class="brand"><span>Acme</span> Web Design</h1>
        <div class="wrapper animated bounceInLeft">
          <div class="company-info">
            <ul>
              <li><i class="fa fa-road"></i></li>
              <li><i class="fa fa-phone"></i></li>
              <li><i class="fa fa-envelope"></i> msippel415@gmail.com</li>
            </ul>
          </div>
          <div class="contact">
            <h3>Email Us</h3>
            {{msg}}
            <form method="POST" action"/send">
              <p>
                <label>Name</label>
                <input type="text" name="name">
              </p>
              <p>
                <label>Company</label>
                <input type="text" name="company">
              </p>
              <p>
                <label>Email Address</label>
                <input type="email" name="email">
              </p>
              <p>
                <label>Phone Number</label>
                <input type="text" name="phone">
              </p>
              <p class="full">
                <label>Message</label>
                <textarea name="message" rows="5"></textarea>
              </p>
              <p class="full">
                <button type="submit">Submit</button>
              </p>
            </form>
            <p>Thank you Brad at Traversy media for the tutorial!</p>
          </div>
        </div>
      </div>
    </body>
    </html>

app.js：

    const express = require('express');
    const bodyParser = require('body-parser');
    const exphbs = require('express-handlebars');
    const path = require('path');
    const nodemailer = require('nodemailer');

    const app = express();

    // View engine setup
    app.engine('handlebars', exphbs());
    app.set('view engine', 'handlebars');

    // Static folder
    app.use('/public', express.static(path.join(__dirname, 'public')));

    // Body Parser Middleware
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use(bodyParser.json());

    app.get('/', (req, res) => {
      res.render('contact', {layout: false});
    });

    app.post('/send', (req, res) => {
      const output = `
        <p>You have a new contact request</p>
        <h3>Contact Details</h3>
        <ul>
          <li>Name: ${req.body.name}</li>
          <li>Company: ${req.body.company}</li>
          <li>Email: ${req.body.email}</li>
          <li>Phone: ${req.body.phone}</li>
        </ul>
        <h3>Message</h3>
        <p>${req.body.message}</p>
      `;

      // create reusable transporter object using the default SMTP transport
      let transporter = nodemailer.createTransport({
        host: 'smtp.gmail.com',
        port: 587,
        secure: false, // true for 465, false for other ports
        auth: {
            user: 'msippel415@gmail.com', // generated ethereal user
            pass: '********'  // generated ethereal password
        },
        tls:{
          rejectUnauthorized:false
        }
      });

      // setup email data with unicode symbols
      let mailOptions = {
          from: '"Nodemailer Contact" <msippel415@gmail.com>', // sender address
          to: 'msippel415@gmail.com', // list of receivers
          subject: 'Node Contact Request', // Subject line
          text: 'Hello world?', // plain text body
          html: output // html body
      };

      // send mail with defined transport object
      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('contact', {msg:'Email has been sent'});
      });
      });

    app.listen(3000, () => console.log('Server started...'));
    json
    {
      "name": "nodecontactform",
      "version": "1.0.0",
      "description": "sample app using nodemailer",
      "main": "app.js",
      "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
      },
      "author": "mcs",
      "license": "MIT",
      "dependencies": {
        "body-parser": "^1.19.0",
        "express": "^4.17.1",
        "express-handlebars": "^3.1.0",
        "i": "^0.3.6",
        "nodemailer": "^6.4.2",
        "npm": "^6.13.4"
      }
    }

【问题讨论】：

发布错误是什么意思？服务器和客户端（浏览器）控制台显示什么？

标签： javascript html forms express nodemailer

【解决方案1】：

https://nodemailer-mcs.herokuapp.com/

在 Heroku 上完成了一些工作，但我很高兴，最终结果是，如果没有 dan 的帮助，我不会这样做，那封空灵的电子邮件给了我很大的希望。 heroku 有一些设置，带有配置文件，启动脚本设置并侦听端口：process.env.PORT || 3000;

【讨论】：

【解决方案2】：

您的第一个错误Cannot POST / 可以通过在<form> 标记action 属性中添加= 符号来修复：

<form method="POST" action="/send">

在您的版本中，您实际上是在需要 POST /send 时发出此请求 POST /。

其他错误最好通过复制 Nodemailer 提供的代码来处理。我拉入您的项目并编辑了 app.js 以符合 Nodemailer 的示例，它运行良好。您需要在POST /send 路由中调整对res.render 的调用以添加layout:false 选项：

res.render('contact', { layout: false, msg:'Email has been sent'});

而且您需要生成一个虚无缥缈的用户并使用这些凭据：

  // Only needed if you don't have a real mail account for testing
  let testAccount = await nodemailer.createTestAccount();

  // create reusable transporter object using the default SMTP transport
  let transporter = nodemailer.createTransport({
    host: "smtp.ethereal.email",
    port: 587,
    secure: false, // true for 465, false for other ports
    auth: {
      user: testAccount.user, // generated ethereal user
      pass: testAccount.pass // generated ethereal password
    }
  });

这是我用来让它工作的 app.js 的完整代码：

app.js

const express = require('express');
const bodyParser = require('body-parser');
const exphbs = require('express-handlebars');
const path = require('path');
const nodemailer = require('nodemailer');

const app = express();

// View engine setup
app.engine('handlebars', exphbs());
app.set('view engine', 'handlebars');

// Static folder
app.use('/public', express.static(path.join(__dirname, 'public')));

// Body Parser Middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.get('/', (req, res) => {
  res.render('contact', {layout: false});
});

app.post('/send', (req, res) => {

  const mailBody = `
    <p>You have a new contact request</p>
    <h3>Contact Details</h3>
    <ul>
      <li>Name: ${req.body.name}</li>
      <li>Company: ${req.body.company}</li>
      <li>Email: ${req.body.email}</li>
      <li>Phone: ${req.body.phone}</li>
    </ul>
    <h3>Message</h3>
    <p>${req.body.message}</p>
  `;

  sendMail(mailBody).catch(console.error);

  res.render('contact', { layout: false, msg:'Email has been sent'});

});

// async..await is not allowed in global scope, must use a wrapper
async function sendMail(html) {
  // Generate test SMTP service account from ethereal.email
  // Only needed if you don't have a real mail account for testing
  let testAccount = await nodemailer.createTestAccount();

  // create reusable transporter object using the default SMTP transport
  let transporter = nodemailer.createTransport({
    host: "smtp.ethereal.email",
    port: 587,
    secure: false, // true for 465, false for other ports
    auth: {
      user: testAccount.user, // generated ethereal user
      pass: testAccount.pass // generated ethereal password
    }
  });

  // send mail with defined transport object
  let info = await transporter.sendMail({
    from: '"Fred Foo ?" <foo@example.com>', // sender address
    to: "bar@example.com, baz@example.com", // list of receivers
    subject: "Hello ✔", // Subject line
    text: "Hello world?", // plain text body
    html // html body
  });

  console.log("Message sent: %s", info.messageId);
  // Message sent: <b658f8ca-6296-ccf4-8306-87d57a0b4321@example.com>

  // Preview only available when sending through an Ethereal account
  console.log("Preview URL: %s", nodemailer.getTestMessageUrl(info));
  // Preview URL: https://ethereal.email/message/WaQKMgKddxQDoou...
}

app.listen(3000, () => console.log('Server started...'));

这里有一个 gif 来展示它的外观：

您可以在此处找到按预期工作的项目分支：nodemailer-repo

【讨论】：

非常感谢施罗德先生。生病了，让你知道它是怎么回事。感谢您的时间。我不知道没有你我会怎么做。