如何修复后端 POST 消息，给出 HTTP 失败响应 http://localhost:4200/send:404

Question

由于 HTTP 响应错误 404，尝试提交表单请求将失败。

我已经尝试将端口更改为 3000，并且 url 到 http：localhost：3000/send 它仍然给出了相同的错误

HTML 表单：app.component.html

form class="text-center border border-light p-5" [formGroup]="contactForm" (ngSubmit)="onSubmit()">
<p class="h4 mb-4">Contact us</p>
<!-- Name -->
<input type="text" formControlName="contactFormName" id="defaultContactFormName" mdbInput
class="form-control mb-4" placeholder="Name">
<!-- Email -->
<input type="email" formControlName="contactFormEmail" id="defaultContactFormEmail" mdbInput
class="form-control mb-4" placeholder="E-mail">
<!-- Subject -->
<label>Subject</label>
<select formControlName="contactFormSubjects" class="browser-default custom-select mb-4">
<option value="" disabled>Choose option</option>
<option value="1" selected>Feedback</option>
<option value="2">Report a bug</option>
<option value="3">Feature request</option>
<option value="4">Feature request</option>
</select>
<!-- Message -->
<div class="form-group">
<textarea formControlName="contactFormMessage" class="form-control rounded-0" mdbInput id="exampleFormControlTextarea2"
rows="3" placeholder="Message"></textarea>
</div>
<!-- Copy -->
<mdb-checkbox [default]="true" class="mb-4">Send me a copy of this message</mdb-checkbox>
<!-- Send button -->
<button mdbBtn color="info" outline="true" block="true" class="z-depth-0 my-4 waves-effect"
mdbWavesEffect type="submit" [disabled]="disabledSubmitButton">Send</button>
</form>

connection.service.ts

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class ConnectionService {
url = 'http://localhost:4200/send';
constructor(private http: HttpClient) { }
sendMessage(messageContent: any) {
return this.http.post(this.url,
JSON.stringify(messageContent),
{ headers: new HttpHeaders({ 'Content-Type': 'application/json' }), responseType: 'text' });
}
}

服务器.js

const express = require('express');
const nodemailer = require('nodemailer');
const app = express();
const port = 4200;
const bodyParser = require('body-parser');
const transporter = nodemailer.createTransport({
host: 'smtp.gmail.com',
provider: 'gmail',
port: 465,
secure: true,
auth: {
user: '**********', // Enter here email address from which you want to send emails
pass: '**********' // Enter here password for email account from which you want to send emails
},
tls: {
rejectUnauthorized: false
}
});
app.use(bodyParser.json());
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
app.post('/send', function (req, res) {
let senderName = req.body.contactFormName;
let senderEmail = req.body.contactFormEmail;
let messageSubject = req.body.contactFormSubjects;
let messageText = req.body.contactFormMessage;
let copyToSender = req.body.contactFormCopy;
let mailOptions = {
to: [' '], // Enter here the email address on which you want to send emails from your customers
from: senderName,
subject: messageSubject,
text: messageText,
replyTo: senderEmail
};
if (senderName === '') {
res.status(400);
res.send({
message: 'Bad request'
});
return;
}
if (senderEmail === '') {
res.status(400);
res.send({
message: 'Bad request'
});
return;
}
if (messageSubject === '') {
res.status(400);
res.send({
message: 'Bad request'
});
return;
}
if (messageText === '') {
res.status(400);
res.send({
message: 'Bad request'
});
return;
}
if (copyToSender) {
mailOptions.to.push(senderEmail);
}
transporter.sendMail(mailOptions, function (error, response) {
if (error) {
console.log(error);
res.end('error');
} else {
console.log('Message sent: ', response);
res.end('sent');
}
});
});
app.listen(port, function () {
console.log('Express started on port: ', port);
});

我希望提交按钮从定义的电子邮件地址发送电子邮件

Answer 1

这有点晚了，我在尝试遵循本教程时也遇到了这个问题。问题是我根本没有运行服务器.js文件。

首先保持"connection.service.ts"和"server.js"文件中的端口号相同(我使用了教程使用的相同编号"300"(。

然后，要运行节点，请在项目中创建一个新终端并键入node server.js