Хочу сказать сразу, что если дублирую вопрос - с удовольствием ознакомлюсь с первоисточником, потому как не нашел ничего похожего.
Я столкнулся с проблемой когда создавал компонент формы.
import React, {Component} from 'react'
import axios from "axios";
export class FibForm extends Component {
constructor(props) {
super(props);
this.state = {
numForRequest: "",
result: ""
};
}
getResult = () => {
console.log('getting result');
alert(JSON.stringify({num: this.state.numForRequest}));
axios.post(
'http://localhost:8080/getNum',
JSON.stringify({num : this.state.numForRequest})
)
//.then(response => this.setState({result: response.data.number}))
};
onChange = (event) =>{
this.setState({numForRequest: event.target.value})
};
render() {
return (
<div>
<p><input type="text" className="N-input" value={this.state.numForRequest} onChange= {this.onChange}/></p>
<p><button className="Buttons" onClick={this.getResult}>Рассчитать</button></p>
{/*<p>{this.state.result}</p>*/}
</div>
)
}
}
export default FibForm;
По задумке данные из текстового поля должны в Json формате пересылаться на node js api (express) Привожу выдержку кода routes:
const router = require('express').Router(),
fibonacci = require('fibonacci');
router.post('/', (request, response)=>{
console.log(request.body);
try {
console.log(request.body);
let body = JSON.parse(request.body);
response.statusCode = 200;
return response.send(fibonacci.iterate(number));
}
catch (e) {
console.log(e.message)
response.statusCode = 404;
return response.send({message: e.messageerror})
}
});
module.exports = router;
При отправке данных (Строка с alert) я вижу вполне нормальный Json:
Тело запроса выглядит нормально, однако я вижу "лишние" данные формы:
Самым странным образом выглядит то что я вижу на стороне сервера, прикладываю вид оъекта в отладчике:
Я пробовал писать отправку по документации, изначально так и было:
axios.post(
'http://localhost:8080/getNum',
{num : this.state.numForRequest}
)
Но при таком способе записи посылается запрос OPTIONS вместо POST.
Прошу помочь в решении проблемы. Укажите, пожалуйста, на ошибки.
На случай, если это может оказаться важным, корневой скрипт node js:
const express = require('express'),
app = express(),
FibRoutes = require('./routes/index'),
bodyParser = require('body-parser');
const port = 8080;
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use('/getNum', FibRoutes);
app.listen(port, ()=>{
console.log(`Back server is listening on port ${port}.`)
});