Send email with Angular and NodeMailer

回眸只為那壹抹淺笑 提交于 2019-12-10 05:00:45

问题


how is it going?

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 ....."

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

I assume this code is to concatenated the node.js code into Angular5 app: this.http.post('/sendemail', this.cEmail).subscribe(data => {console.log(data);});


回答1:


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

});



来源:https://stackoverflow.com/questions/48605404/send-email-with-angular-and-nodemailer

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!