javascript - Nuxt server middleware post request not working - Stack Overflow

admin管理员组

文章数量:1026670

I saw in the documentation of Nuxt js (.x/configuration-glossary/configuration-servermiddleware/) that I can extend server middleware with express. i tested it with GET request and it worked but when i use POST request there is no body in request.

/api/index.js:

const express = require('express');
const bodyParser = require('body-parser');
import Cities from './offline/cities';

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/findCity', function (req, res) {
  if (!req.body.input) {
    res.status(400).json();
    return;
  }
  res.status(200).json(Cities.filter(req.body.input, req.body.opt));
});

module.exports = { path: '/api', handler: app };

/nuxt.config.js:

serverMiddleware: [ '~/api/index.js' ],

mixin.js

async findCity(input, opt) {
   return (await this.$axios.post(process.env.DOMAIN_URL + '/api/findCity', { input, opt })).data;
}

in chrome dev tools the body is sent:

I saw in the documentation of Nuxt js (https://nuxtjs/docs/2.x/configuration-glossary/configuration-servermiddleware/) that I can extend server middleware with express. i tested it with GET request and it worked but when i use POST request there is no body in request.

/api/index.js:

const express = require('express');
const bodyParser = require('body-parser');
import Cities from './offline/cities';

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/findCity', function (req, res) {
  if (!req.body.input) {
    res.status(400).json();
    return;
  }
  res.status(200).json(Cities.filter(req.body.input, req.body.opt));
});

module.exports = { path: '/api', handler: app };

/nuxt.config.js:

serverMiddleware: [ '~/api/index.js' ],

mixin.js

async findCity(input, opt) {
   return (await this.$axios.post(process.env.DOMAIN_URL + '/api/findCity', { input, opt })).data;
}

in chrome dev tools the body is sent:

• javascript
• node.js
• express
• nuxt.js

Share Improve this question Follow edited Mar 8, 2022 at 11:25 Arshia Moghaddam asked Jan 13, 2021 at 7:16 Arshia MoghaddamArshia Moghaddam 53888 silver badges2626 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Exclude body-parser

I don't know if this would directly solve the original problem, but it is an efficiency. This helped me when troubleshooting getting req.body.

With Express +4.16, you don't need a separate import for body-parser because .json and .urlencoded are included in Express base.

Changelog: https://expressjs./en/changelog/4x.html#4.16.0

An article about it: https://medium./@mmajdanski/express-body-parser-and-why-may-not-need-it-335803cd048c

This works for me:

const express = require('express')
const app = express()
app.use(express.urlencoded({extended: true}))
app.use(express.json())

app.all('/myAPIroute*', (req, res) => {
    console.log("Req body is: ", req.body)
})

module.exports = app

In your /api/index.js file you can get request data by this way:

req.on('data', (data) => {
    console.log(data.toString())
})

Using only data you get a readable Buffer object. Adding .toString() you have a 'plain text' representation of data.

I saw in the documentation of Nuxt js (.x/configuration-glossary/configuration-servermiddleware/) that I can extend server middleware with express. i tested it with GET request and it worked but when i use POST request there is no body in request.

/api/index.js:

const express = require('express');
const bodyParser = require('body-parser');
import Cities from './offline/cities';

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/findCity', function (req, res) {
  if (!req.body.input) {
    res.status(400).json();
    return;
  }
  res.status(200).json(Cities.filter(req.body.input, req.body.opt));
});

module.exports = { path: '/api', handler: app };

/nuxt.config.js:

serverMiddleware: [ '~/api/index.js' ],

mixin.js

async findCity(input, opt) {
   return (await this.$axios.post(process.env.DOMAIN_URL + '/api/findCity', { input, opt })).data;
}

in chrome dev tools the body is sent:

I saw in the documentation of Nuxt js (https://nuxtjs/docs/2.x/configuration-glossary/configuration-servermiddleware/) that I can extend server middleware with express. i tested it with GET request and it worked but when i use POST request there is no body in request.

/api/index.js:

const express = require('express');
const bodyParser = require('body-parser');
import Cities from './offline/cities';

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.post('/findCity', function (req, res) {
  if (!req.body.input) {
    res.status(400).json();
    return;
  }
  res.status(200).json(Cities.filter(req.body.input, req.body.opt));
});

module.exports = { path: '/api', handler: app };

/nuxt.config.js:

serverMiddleware: [ '~/api/index.js' ],

mixin.js

async findCity(input, opt) {
   return (await this.$axios.post(process.env.DOMAIN_URL + '/api/findCity', { input, opt })).data;
}

in chrome dev tools the body is sent:

• javascript
• node.js
• express
• nuxt.js

Share Improve this question Follow edited Mar 8, 2022 at 11:25 Arshia Moghaddam asked Jan 13, 2021 at 7:16 Arshia MoghaddamArshia Moghaddam 53888 silver badges2626 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Exclude body-parser

I don't know if this would directly solve the original problem, but it is an efficiency. This helped me when troubleshooting getting req.body.

With Express +4.16, you don't need a separate import for body-parser because .json and .urlencoded are included in Express base.

Changelog: https://expressjs./en/changelog/4x.html#4.16.0

An article about it: https://medium./@mmajdanski/express-body-parser-and-why-may-not-need-it-335803cd048c

This works for me:

const express = require('express')
const app = express()
app.use(express.urlencoded({extended: true}))
app.use(express.json())

app.all('/myAPIroute*', (req, res) => {
    console.log("Req body is: ", req.body)
})

module.exports = app

In your /api/index.js file you can get request data by this way:

req.on('data', (data) => {
    console.log(data.toString())
})

Using only data you get a readable Buffer object. Adding .toString() you have a 'plain text' representation of data.

本文标签： javascriptNuxt server middleware post request not workingStack Overflow