如何记录nuxt服务器端网络请求？答案

【问题标题】：How to log nuxt server side network requests?如何记录nuxt服务器端网络请求？
【发布时间】：2019-01-02 01:13:57
【问题描述】：

有什么方法可以记录所有由 nuxtjs 在服务器端完成的网络请求吗？

我已经在使用 node --inspect 来启用 chrome 控制台，但那里缺少网络选项卡。

非常感谢任何提示。

【问题讨论】：

*如何记录nuxt服务器端网络请求？ :)

标签： nuxt.js server-side-rendering

【解决方案1】：

我正在使用 axios nuxt 插件 (https://axios.nuxtjs.org)。

我创建了一个插件来扩展它 (https://axios.nuxtjs.org/extend.html)：

export default ({$axios, store}) => {
  $axios.onResponse(response => {
    console.log(`[${response.status}] ${response.request.path}`);
  });

  $axios.onError(err => {
    console.log(`[${err.response && err.response.status}] ${err.response && err.response.request.path}`);
    console.log(err.response && err.response.data);
  })
}

onError() 记录错误请求
onResponse() 记录成功的请求

这是一个示例输出：

[200] /dashboard/rights/user
[200] /dashboard/rights/segment
[200] /dashboard/user/me
[400] /group/entries?group_id=undefined
{ status: 'error',
  codeStatus: 400,
  detail:
   [ { message:
        '"group_id" with value "undefined" fails to match the valid object id pattern',
       path: 'group_id',
       type: 'string.regex.name' } ] }

希望对你有帮助

【讨论】：

【解决方案2】：

添加到 Nicolas 的解决方案。

在 Nuxt 应用中创建 axios 插件后，您可以将其添加到 Nuxt 配置文件中，并将 mode 设置为 server，因为您想在 服务器端运行它 .

更多关于 Nuxt 插件here.

plugins: [
    { src: '~/plugins/axios', mode: 'server' },
]

【讨论】：

【解决方案3】：

FWIW，我对其他答案中的任何一种方法都不太走运。最终对我有用的是将ssr: false 添加到nuxt.config.js 以使其成为 SPA 而不是 SSR 并在浏览器控制台上进行调试。?‍♂️

【讨论】：

【解决方案4】：

如果我正确理解了这个问题，您希望您的 nuxtjs 应用程序在服务器端呈现模式下记录提供的请求。

因此，Axios 不是答案，因为它用于发出请求，而不是为它们提供服务。

具有挑战性的部分是弄清楚如何进入服务器渲染部分。我有同样的要求，并决定制作 nuxtjs 中间件并使用Express 作为我的服务器。然后我在 Express 中配置登录。这对我很有效，因为我可以添加其他路线，例如健康检查端点。

这个 Nuxtjs 文档表明这是一个预期的模式： https://nuxtjs.org/docs/internals-glossary/nuxt-render

【讨论】：