Question

我在Vue前端有一个axios发布请求，该请求将一些数据发送到API端点（快速）。问题是我在接收到发布请求的控制器上看不到任何数据。

//app.js

var express = require('express')
var cors = require('cors')
var app = express()
var port = process.env.port || 1337

app.use(cors({origin: true}));
var imagenmatriculaController = require('./controllers/imagenmatriculaController.js')()

app.use("/api/imagenmatricula", imagenmatriculaController)

app.listen(port, function () {})


//imagenmatriculaController.js

var express = require('express')
var router = express.Router()
var routes = function (){
    router.route('/')
        .post(function(req,res){

            console.log(req.data)
            res.json('ok')
        })
        return router
}

module.exports = routes

我确实在服务器上收到了请求日志，然后“确定”返回客户端，但是在console.log（req.data）上却得到了未定义的信息。

//vue post

var headers = {
    'Content-Type': 'application/json;charset=UTF-8',
    'Access-Control-Allow-Origin': '*'
};

axios.post('http://localhost:1337/api/imagenmatricula', {
                    headers: headers,
                    data: 'test'
                })
                .then(response => {
                    console.log(response);
                }).catch(error => {
                    console.log(error);
                    console.log('ERROR::', error.response.data);
                });

Answer 1

为了在后端接收json数据，您需要设置解析器。您可以使用body-parser。然后您的代码应该像这样

var express = require('express')
var cors = require('cors')
var app = express()
var port = process.env.port || 1337
var bodyParser = require('body-parser')

app.use(cors({origin: true}));
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))

// parse application/json
app.use(bodyParser.json())
var imagenmatriculaController = require('./controllers/imagenmatriculaController.js')()

app.use("/api/imagenmatricula", imagenmatriculaController)

app.listen(port, function () {})


//imagenmatriculaController.js

var express = require('express')
var router = express.Router()
var routes = function (){
    router.route('/')
        .post(function(req,res){

            console.log(req.body)
            res.json('ok')
        })
        return router
}

module.exports = routes

客户端应如下所示：

var headers = {
    'Content-Type': 'application/json;charset=UTF-8',
    'Access-Control-Allow-Origin': '*'
};

    axios.post('http://localhost:1337/api/imagenmatricula', {
                        headers: headers,
                        data: { test: 'test' }
                    })
                    .then(response => {
                        console.log(response);
                    }).catch(error => {
                        console.log(error);
                        console.log('ERROR::', error.response.body);
                    });

如果在服务器上的路由设置正确，这应该可以工作。

Answer 2

您需要具有正文分析器才能在node和express中使用json数据。因此，为了使您的代码正常工作。首先通过“ npm install body-parser”命令安装body-parser，然后将其用作代码中的中间件，如下所示：

var express = require('express')
var cors = require('cors')
var app = express()
var port = process.env.port || 1337
var bodyParser = require('body-parser')

app.use(cors({origin: true}));

//It will parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))

//It will parse application/json
app.use(bodyParser.json())

var imagenmatriculaController = require('./controllers/imagenmatriculaController.js')()

app.use("/api/imagenmatricula", imagenmatriculaController)

app.listen(port, function () {})

在imagenmatriculaController.js中编写，

var express = require('express')
var router = express.Router()
var routes = function (){
    router.route('/')
        .post(function(req,res){

            console.log(req.body)
            res.json('ok')
        })
        return router
}

module.exports = routes

您的前端客户端应包含以下代码：

var headers = {
    'Content-Type': 'application/json;charset=UTF-8',
    'Access-Control-Allow-Origin': '*'
};

    axios.post('http://localhost:1337/api/imagenmatricula', {
                        headers: headers,
                        data: { test: 'test' }
                    })
                    .then(response => {
                        console.log(response);
                    }).catch(error => {
                        console.log(error);
                        console.log('ERROR::', error.response.body);
                    });

注意：：如果您使用的是Express的更高版本，即v4.16.0，则可以使用bodyParser.json()和bodyParser.urlencoded()来代替express.json()和express.urlencoded()，因为它是v4.16.0版中内置的express中间件。因此，明智地选择

app.use(express.json())
app.use(express.urlencoded())

无法通过API从axios接收数据

2 个答案: