在 Nuxt Express 中间件获取请求中未定义 req.query

Question

不是服务器中间件之类的专业人士，但没有太多线索就卡住了。

在 vue 组件中，我使用 axios 检索数据：

  axios
    .get('/api/getDailyFeedback', {
      params: {
        start: '2018-05-01'
      }
    })

其中涉及 Nuxt 中的 express（4.16.2 版）服务器中间件设置。我已经收到正常的 get 和 post 请求，但问题是当我想将参数传递到如下所示的 get 请求时：

router.get('/getDailyFeedback', (req, res) => {
   console.log('Query:', req.query.start);
   //do stuff
});

我在 Express 4 上的小经验，我花了一点时间才意识到为什么在 post 请求正文中传递的参数未定义，但这是因为我需要将 body-parser.json() 添加到我的 nuxt配置，因为他们从主快递包中删除了它。同样，我认为我需要 bodyParse.urlencoded 但这没有用。这是我添加到我的 nuxt.config 的行：

serverMiddleware: [bodyParser.urlencoded({ extended: false }), bodyParser.json(), '~/api'],

我不确定内容类型是否设置不正确，或者我在这里遗漏了一些简单的东西。我知道我可以使用各种库从我可以访问的 url 字符串中获取参数，因为 Axios 正在按预期工作并将我的“params”对象添加到我的 get 请求的末尾。但是我看到的很多其他问题的解决方案是“哦，就像访问 req.query 一样简单” Alas Express 无法定义 req.query 对象，甚至 req.params 或 req.body。

希望这是足够详细的内容，非常感谢您的阅读和任何建议。

Answer 1

嗯，第一次尝试在 Nuxt 中使用 get 请求是一个令人不快的惊喜，不是吗？Nuxt 创建了一个连接实例，这会导致一些陷阱。它的 req 是 Node.js http 请求对象，所以它没有query property并且request.body也在获取请求中被跳过！

但凡事都有办法。您的代码：

  axios.get('/api/getDailyFeedback', {
      params: {
        start: '2018-05-01'
      }
    })

转换为以下 URI 调用：

/api/getDailyFeedback?start=2018-05-01

因此，您已经获得了 URI 中的所有参数，您可以通过 url 解析从中检索它们。url顺便说一下，模块随 Node.js 一起提供。

const url = require("url");

router.get('/getDailyFeedback', (req, res) => {
   let queryData = url.parse(req.url, true).query
   console.log('Query:', queryData.start)
});

我写了一个用自定义属性扩展 req 的小助手。这是代码：

router.use((req, res, next) => {
  var theQuery = url.parse(req.url, true).query
  req.queryData = theQuery 
  next()
})

然后你可以像这样使用它：

router.get('/getDailyFeedback', (req, res) => {
   console.log('Query:', req.queryData.start)
});

通过 get 传递参数的其他方法是使用可选的 uri 段：

router.get('/getDailyFeedback/:start?', (req, res) => {
   console.log('Query:', req.params.start)
});