Javascript 从React返回空正文的快速POST请求
你好,我正在开发react/express应用程序。我已经能够从我的服务器发出GET请求,但是,我在发出POST请求时遇到了问题。当我这样做时,我的服务器返回一个空的主体。我将主体解析器作为一个依赖项,接受json作为内容,但对于空主体仍然并没有什么好运气。下面是我的服务器/客户端代码和依赖项。如果你们看到我不知道的东西,请告诉我 Index.jsJavascript 从React返回空正文的快速POST请求,javascript,node.js,reactjs,express,cors,Javascript,Node.js,Reactjs,Express,Cors,你好,我正在开发react/express应用程序。我已经能够从我的服务器发出GET请求,但是,我在发出POST请求时遇到了问题。当我这样做时,我的服务器返回一个空的主体。我将主体解析器作为一个依赖项,接受json作为内容,但对于空主体仍然并没有什么好运气。下面是我的服务器/客户端代码和依赖项。如果你们看到我不知道的东西,请告诉我 Index.js const express = require('express'); const path = require('path'); const
const express = require('express');
const path = require('path');
const app = express();
const bodyParser = require('body-parser');
//routes
require('./routes/sendMessageToEmail')(app);
require('./routes/helloWorld')(app);
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static(path.join(__dirname, 'client/build')));
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname+'/client/build/index.html'));
});
const port = process.env.PORT || 1111;
app.listen(port);
例如,当我在index.js文件中切换路由声明的顺序时,在
行,我得到一个未定义的,与一个空物体相对的
邮路
module.exports = app => {
app.post('/api/message', (req, res) => {
console.log('>>>>>>>>>> ', req.body);
res.send(req.body)
});
}
import axios from 'axios';
const sendToExpress = (input) => {
return fetch('/api/message', {
mode: 'no-cors',
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({message: 'asdfafa;k'})
//body: JSON.stringify({"message": input})
})
}
//ACTION CREATORS
export const sendInputToServer = (input) => ({
type: 'SEND_INPUT_TO_SERVER', payload: sendToExpress(input)
});
My console.log正在返回一个空对象。我已经在邮递员,从我的浏览器,卷发等发出了发帖请求。我得到了一个200状态的回复,但是,尸体仍然是空的
Server package.json
{
"name": "Blog",
"version": "1.0.0",
"engines": {
"node": "6.11.1"
},
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"server": "nodemon index.js",
"client": "npm run start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "cd client && npm install --only=dev && npm install && npm run build"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"body-parser": "^1.17.2",
"concurrently": "^3.5.0",
"express": "^4.15.3"
}
}
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.16.2",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"react-iframe": "^1.0.7",
"react-redux": "^5.0.5",
"react-router-dom": "^4.1.2",
"react-scroll": "^1.5.4",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0",
"semantic-ui-react": "^0.71.3"
},
"devDependencies": {
"react-scripts": "1.0.10"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"proxy": "http://localhost:1111/"
}
Client Package.json
{
"name": "Blog",
"version": "1.0.0",
"engines": {
"node": "6.11.1"
},
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"server": "nodemon index.js",
"client": "npm run start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "cd client && npm install --only=dev && npm install && npm run build"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"body-parser": "^1.17.2",
"concurrently": "^3.5.0",
"express": "^4.15.3"
}
}
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.16.2",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"react-iframe": "^1.0.7",
"react-redux": "^5.0.5",
"react-router-dom": "^4.1.2",
"react-scroll": "^1.5.4",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0",
"semantic-ui-react": "^0.71.3"
},
"devDependencies": {
"react-scripts": "1.0.10"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"proxy": "http://localhost:1111/"
}
反应后路线
module.exports = app => {
app.post('/api/message', (req, res) => {
console.log('>>>>>>>>>> ', req.body);
res.send(req.body)
});
}
import axios from 'axios';
const sendToExpress = (input) => {
return fetch('/api/message', {
mode: 'no-cors',
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({message: 'asdfafa;k'})
//body: JSON.stringify({"message": input})
})
}
//ACTION CREATORS
export const sendInputToServer = (input) => ({
type: 'SEND_INPUT_TO_SERVER', payload: sendToExpress(input)
});
如果你能帮我弄明白为什么我的post请求返回的是一个空的身体,我将不胜感激
尝试删除此行:
模式:“无cors”
为我工作。你的路线一定要跟在身体后面。另外,在您的路由中,您可能还希望使用res.json()而不是result.send,因为您的客户机希望接收jsonHey,我切换了路由并尝试了res.json(),但仍然没有雪茄。您在我的代码中看到的任何其他内容都可能是帖子正文返回空的问题吗?