【问题标题】:Send email with Angular and NodeMailer使用 Angular 和 NodeMailer 发送电子邮件
【发布时间】:2018-07-14 07:06:08
【问题描述】:

进展如何?

我正在尝试弄清楚如何使用 Angular 5 和 Node.js 发送电子邮件 - 使用 nodemailer-。

我要存档的是当某些用户在页面中进行预约并且系统获取提供的电子邮件并在他们单击“安排我的.....”按钮时向用户发送一些信息时

正如您将在 appointment.component.ts 中看到的,当用户单击按钮时,变量更改为“true”以向用户显示一些隐藏的 div 并同时显示一个快餐栏,但什么都没发生。控制台日志中没有错误,也没有任何错误。有什么想法吗?

下面是我的代码。提前致谢。

server.js

const express    = require('express');
const path       = require('path');
const http       = require('http');
const bodyParser = require('body-parser');
const nodeMailer = require('nodemailer');

const api = require('./server/routes/api');

const app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static(path.join(__dirname, 'dist')));

app.use('/api', api);
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});
app.post('/sendemail', (req, res) => {
  let transporter = nodeMailer.createTransport({
    host: 'smtp.gmail.com',
    port: 465,
    secure: true,
    auth: {
      user: 'xxxxx@gmail.com',
      pass: 'xxxxxxxxxxxxx'
    }
  });
  let mailOptions = {
    from: '"Nourish Team" <no-reply@nourish.io>',
    to: "anyemailhere@gmail.com",
    subject: 'Test',
    text: 'Hello!',
    html: '<b>Testing email function</b>'
  };

  transporter.sendMail(mailOptions, (error, info) => {
    if(error) {
      return console.log(error);
    }
    console.log('Message sent');
  })
});

const port = process.env.PORT || '3000';
app.set('port', port);

const server = http.createServer(app);
server.listen(port, () => console.log(`API running on localhost:${port}`));

appointment.component.html

<form novalidate action="/send-email" method="POST" (ngSubmit)="sendEmail()">
      <mat-form-field class="middle-width" ngClass.xs="full-width">
        <input matInput placeholder="Nombre Completo" [formControl]="fullName" required>
        <mat-error *ngIf="fullName.hasError('pattern') && !fullName.hasError('required')">
          El campo solo acepta letras.
        </mat-error>
        <mat-error *ngIf="fullName.hasError('required')">
          ¡Este cambo es <strong>requerido</strong>!
        </mat-error>
      </mat-form-field>
      <mat-form-field class="middle-width" ngClass.xs="full-width">
        <input matInput placeholder="Correo Electrónico" type="email" [formControl]="cEmail" required>
        <mat-error *ngIf="cEmail.hasError('email') && !cEmail.hasError('required')">
          Debes introducir un correo electrónico válido
        </mat-error>
        <mat-error *ngIf="cEmail.hasError('required')">
          ¡Este cambo es <strong>requerido</strong>!
        </mat-error>
      </mat-form-field>
      <mat-form-field class="middle-width" ngClass.xs="full-width">
        <input matInput placeholder="Teléfono" type="tel" [formControl]="phone" maxlength="14" mask="(000) 000 0000" required>
        <mat-hint align="end">{{phone.value.length}} / 10</mat-hint>
        <mat-error *ngIf="phone.hasError('pattern') && !phone.hasError('required')">
          El campo sólo acepta números
        </mat-error>
        <mat-error *ngIf="phone.hasError('required')">
          ¡Este cambo es <strong>requerido</strong>!
        </mat-error>
      </mat-form-field>
      <mat-form-field class="middle-width" ngClass.xs="full-width">
        <input matInput [matDatepicker]="picker" placeholder="Elegir fecha">
        <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
        <mat-datepicker touchUi="true" #picker></mat-datepicker>
      </mat-form-field>
      <br>
      <button mat-raised-button type="submit">Schedule My Appointment</button>
    </form>

appointment.component.ts

sendEmail() {
  this.sucess = true;
  this.snackBar.open('Información enviada exitosamente.', 'x', {
    duration: 5000,
  });
  this.name = this.fullName.value;  
    this.http.post('/sendemail', this.cEmail).subscribe(data => {
    console.log(data);
  });
}

我假设这段代码是将 node.js 代码连接到 Angular5 应用程序中:this.http.post('/sendemail', this.cEmail).subscribe(data => {console.log(data) ;});

【问题讨论】:

  • “但我无法让系统发送电子邮件”:这不是一个有用的错误描述。会发生什么(任何错误消息?)以及您预期会发生什么?
  • @Henry 抱歉。我会更新帖子,谢谢。不,控制台日志中没有错误。我在命令提示符下收到“API 服务 ...”消息,但没有别的;我希望系统会为用户发送包含一些信息的电子邮件。

标签: node.js angular typescript nodemailer


【解决方案1】:

感谢您的代码!我的工作。也许你想改变你的 app.post 方法。

server.js

app.post("/sendemail", (req, res) => {
var transporter = nodemailer.createTransport({
    host: "smtp-mail.outlook.com",
    secureConnection: false,
    port: 587,
    tls: {
        chipers: "SSLv3"
    },
    auth: {
        user: "xxx@hotmail.com",
        pass: "xxx"
    }
});

var mailOptions = {
    from: "xxx@hotmail.com",
    to: "xxx@gmail.com",
    subject: "Nodejs Mail",
    text: "this is the email's body text..."
};

transporter.sendMail(mailOptions, function(error, info) {
    if (error) console.log(error);
    else console.log("Message sent successfully: " + info.response);
});

});

【讨论】:

  • 非常感谢,@iBlehhz
  • 这种方法有多安全?任何人都不能简单地看到登录详细信息吗?
猜你喜欢
  • 2019-02-03
  • 2022-07-27
  • 2015-05-19
  • 1970-01-01
  • 2019-09-30
  • 2021-11-20
相关资源
最近更新 更多