使用Angular和NodeMailer发送电子邮件 [英] Send email with Angular and NodeMailer

查看:79
本文介绍了使用Angular和NodeMailer发送电子邮件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

进展如何?

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

I am trying to figure out how to send an email with Angular 5 and Node.js -using nodemailer-.

我要存档的内容是,当某些用户在页面中进行约会时,当系统中的用户单击安排我的....."按钮时,系统会收到提供的电子邮件并向该用户发送一些信息.

What I want to archive is when some user make an appointment in the page and system gets the provided email and send some information to the user when they click the button "Schedule my ....."

如您在 appointment.component.ts 中所看到的,当用户单击按钮时,变量将更改为"true",以向用户显示一些隐藏的div,并显示小吃盘,但是什么都没发生.控制台日志中没有错误,也没有任何错误.有什么想法吗?

As you'll see in appointment.component.ts, when the user click the button a variable change to "true" to display some hidden div to the user and displays as well a snackbar but nothing happens. No error in the console log nor anything. Any ideas?

这是我下面的代码.预先感谢.

Here is my code below. Thanks in advance.

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) ;});

推荐答案

感谢您的代码!我的工作了.也许您想更改app.post方法.

Thanks for your code! Mine worked. Maybe you want change your app.post method.

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);
});

});

这篇关于使用Angular和NodeMailer发送电子邮件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆