Question

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

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

非常感谢您提供任何提示。

Answer 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' } ] }

希望有帮助

Answer 2

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

Answer 3

增加Nicolas的解决方案。

一旦在Nuxt应用中创建了axios插件，就可以将其添加到Nuxt配置文件中，并将$(function () { $("#draggableImagesQ1").draggable({ revert: function (event, ui) { // on older version of jQuery use "draggable" // $(this).data("draggable") // on 2.x versions of jQuery use "ui-draggable" // $(this).data("ui-draggable") $(this).data("uiDraggable").originalPosition = { top: 0, left: 0 }; // return boolean return !event; // that evaluate like this: // return event !== false ? false : true; } }); $(".droppableSpace1").droppable({ drop: function (event, ui) { $("#draggableImagesQ1").addClass("afterDragged"); } }); });设置为mode，以在服务器端运行它。。

有关Nuxt插件here的更多信息。

server

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

3 个答案: