Node.js 邮递http://localhost:3000/api/sendMail 404(未找到)
我正在使用http代理中间件将表单数据从React前端发送到Express server,Node.js 邮递http://localhost:3000/api/sendMail 404(未找到),node.js,reactjs,express,http-proxy-middleware,Node.js,Reactjs,Express,Http Proxy Middleware,我正在使用http代理中间件将表单数据从React前端发送到Express server, 但是http代理中间件似乎不起作用。 它应该代理localhost://5000 而是抛出一个错误: 邮政404(未找到) 前端代码: import React, { Component } from "react"; import axios from "axios"; class EmailForm extends Component { state = { name: "",
但是http代理中间件似乎不起作用。
它应该代理
localhost://5000
而是抛出一个错误: 邮政404(未找到) 前端代码:
import React, { Component } from "react";
import axios from "axios";
class EmailForm extends Component {
state = {
name: "",
email: ""
};
handleSubmit = async e => {
e.preventDefault();
const data = {
name: this.state.name,
email: this.state.email
};
console.log(data);
axios.post("/api/sendMail", data);
};
handleChange = e => {
this.setState({
[e.target.id]: e.target.value
});
};
render() {
return (
<div className="container mt-3">
<form onSubmit={this.handleSubmit}>
<h4 className="grey-text text-darken-3">Send Email</h4>
<div className="form-group">
<label htmlFor="email">Name</label>
<input
className="form-control"
type="text"
id="name"
onChange={this.handleChange}
/>
</div>
<div className="form-group">
<label htmlFor="email">Email</label>
<input
className="form-control"
type="email"
id="email"
onChange={this.handleChange}
/>
</div>
<div className="form-group">
<button className="btn btn-danger">SendMeEmail</button>
</div>
</form>
</div>
);
}
}
export default EmailForm;
Server.js:
app.post("/api/sendMail", (req, res) => {
console.log(req.body);
});
将此行添加到package.json(react项目的)
你用的是React,对吗?您的react在端口3000上运行正确,您的express服务器在端口5000上运行?服务器在端口5000上,我正在使用Concurrent如果您的服务器在端口
5000
上运行,那么您使用3000
的原因如下:http://localhost:3000/api/sendMail
?我必须使用5000
,那么它的遗嘱是这样的:``
app.post("/api/sendMail", (req, res) => {
console.log(req.body);
});
"proxy": "http://localhost:5000"