node.js - Express 后端在从 Angular 5 应用程序传递数据时丢弃数据

Question

我正在构建一个小演示应用程序，以使用 Node Mailer 从表单发送电子邮件。我已将 Angular 5 应用程序连接到 Express 4 后端。我的运行非常简单，项目中的 server.js Express 文件引用了 Angular dist 文件。然后，我构建 Angular 应用程序并运行服务器。

一切工作正常，电子邮件甚至发送，但不知何故， express 后端正在丢失数据(或者我只是没有正确访问它)。在我尝试使用数据的任何地方，电子邮件都会发送“未定义”。

我填写表单字段中的姓名、电话、电子邮件和地址。然后我将数据拉入服务并将其发送到后端。这是我在 Angular 中发送数据的服务:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class ClientService {
    headers: any;
    clientInfo = '';

    constructor(private http: HttpClient) { }

    sendEmail(clientData) {
        console.log(clientData);
        return this.http.post('/send-email', clientData);
    }
}

当我发送这个 http 帖子时，它看起来不错。请求 url 正确， header 为 application/json，负载数据正确:{name: "John Doe", email: "john@johndoemail.com", Phone: "18005555555", message: "test"}

这是我的 server.js:(在有效的 Gmail 帐户信息中包含 x)

 // Get dependencies
const express = require('express');
const nodemailer = require("nodemailer");
const path = require('path');
const http = require('http');
const bodyParser = require('body-parser');

const app = express();
const port = 4300;

// Start server
app.listen(port, function(req, res) {
    console.log('Server is running at port: ', port);
})

// Point static path to dist
app.use(express.static(path.join(__dirname, 'dist')));

// Home route to serve the index file
app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

// Parsers for POST data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/send-email', function (req, res) {
    console.log(req.body);

    let transporter = nodemailer.createTransport({
        host: 'smtp.gmail.com',
        port: 465,
        secure: true,
        auth: {
            user:'xxxxxx@gmail.com',
            pass: 'xxxxxxxx',
        }
    });

    let message = {
        from: 'mailer@nodemailer.com',
        to: 'xxxxx@gmail.com',
        subject: 'New Client Message ' + req.body.name,
        text: 'Name: ' + req.body.name + '\nEmail: ' + req.body.email + '\nPhone: ' + req.body.phone + '\n    ' + req.body.message,
        html: '<p>' + req.body.message + '</p>'     
    };

    transporter.sendMail(message);
    res.json(req.body);
});

在服务器控制台中，req.body 显示为“{}”。 使用我自己的电子邮件，我收到一条从 Nodemailer 发送的消息，但使用的所有数据都只是显示“未定义”。

我需要以不同的方式访问数据吗？也许使用 req 的另一个属性？不管怎样，问题似乎在我的 Express 文件中，所以如果您发现任何问题，请告诉我。

Answer 1

我找到了解决方案。我没有用我的帖子数据实现标题。我将这些更改添加到我的服务中，问题得到了解决:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable()
export class ClientService {
    httpHeader = {
        headers: new HttpHeaders({
            'Content-Type': 'application/json',
        })
    };

    constructor(private http: HttpClient) { }

    sendEmail(clientData) {
        console.log(clientData);
        this.http.post('/send-email', clientData, this.httpHeader);
    }
}

如果您想查看完整的演示，请看这里:https://github.com/xTumulus/NodeMailer_AngularExpress_Demo