Проблема, с которой я сталкиваюсь в настоящее время, заключается в том, что когда я отправляю данные формы в React с использованием axios или даже без него, я не могу получить свои данные на серверной стороне с помощью Express.Я просматриваю запрос, полученный на внутренней консоли, но не могу получить к нему доступ через код.Код реагирования через узел на порту 3000, Экспресс на 3001. Приложение было создано с использованием приложения create-реагировать, вот картинка: Проблема
Структура проекта:
- cssd -> Где я запускаю npm, начинаю запускать back end
- cssd / маршруты / -> Где расположен файл users.js с маршрутами для получения кода
- cssd / client / ->Где я запускаю npm, начинаю запускать интерфейс
- cssd / client / src / setupProxy.js -> где мой прокси-маршрут
Я уже пытался создать файл setupProxy.jsа также многочисленные методы get / post, пытающиеся получить данные и любую информацию, доступную в стеке, также были найдены, но если я что-то пропустил, пожалуйста, дайте мне знать.Даже с консольным журналом в базе, я все еще не могу получить его.
В пределах setupProxy:
const proxy = require('http-proxy-middleware');
module.exports = function(app) {
app.use(proxy('/routes/*',
{ target: "http://localhost:3001/" }
));
}
В клиентском App.js / React:
render() {
return (
<form id="contact-form" onSubmit={this.handleSubmit.bind(this)} method="POST">
<div className="form-group">
<label htmlFor="name">Name</label>
<input type="text" className="form-control" id="name"/>
</div>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input type="text" className="form-control" id="email" aria-describedby="emailHelp"/>
</div>
<div className="form-group">
<label htmlFor="message">Message</label>
<textarea className="form-control" rows="5" id="message"></textarea>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
)
}
handleSubmit(e)
{
e.preventDefault();
const name = document.getElementById('name').value;
const email = document.getElementById('email').value;
const message = document.getElementById('message').value;
var inputData = {name, email, message};
fetch('/routes/users',
{
method: 'POST',
body: inputData
})
alert("sent data");
this.resetForm();
}
Внутри маршрутов / users.js / Express code:
var express = require('express');
var router = express.Router();
const bodyParser = require("body-parser");
const app = express();
app.use(
bodyParser.urlencoded({ // basically any extra characters
extended: true
}),
bodyParser.json()
);
// Re-directs, ex entered in nothing, go to get
router.get("/routes/users", function(req, res) {
console.log("HERE 1 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data: ", name, email, message);
});
router.post("/routes/users", function(req, res) {
console.log("HERE 2 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data", name, email, message);
});
app.get("/routes/users", function(req, res) {
console.log("HERE 3 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data: ", name, email, message);
});
app.post("/routes/users", function(req, res) {
console.log("HERE 4 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data", name, email, message);
});
router.get("routes/users", function(req, res) {
console.log("HERE 5 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data: ", name, email, message);
});
router.post("routes/users", function(req, res) {
console.log("HERE 6 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data", name, email, message);
});
app.get("routes/users", function(req, res) {
console.log("HERE 7 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data: ", name, email, message);
});
app.post("routes/users", function(req, res) {
console.log("HERE 8 !");
var name = req.body.name;
var email = req.body.email;
var message = req.body.message;
console.log("The data", name, email, message);
});
const port = 3000;
//console.log(`Back end is listening on port ${port}`);
app.listen(port, () => console.log(`Back end is listening on port ${port}`));
module.exports = router;
Ожидаемые результаты должны состоять в том, что я получаю console.log от одной из функций и затем могу работать с моим кодом оттуда, но яЯ просто не могу заставить кого-то из них позвонить.Единственная вещь, показанная в консоли, находится на внутренней стороне, получающей запрос