Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12-13 日。

prometheus
@artmizu/nuxt-prometheus

帮助您更好地了解应用程序的运行情况,以及如何在生产环境中优化性能和其他方面。

GitHub Workflow Status

Cover

📊 Nuxt 3 的 Prometheus 集成

帮助您更好地了解应用程序的运行情况,以及如何在生产环境中优化性能和其他方面。**Nuxt 2** 用户可以使用此版本

限制

由于ofetch 包中的此问题,@artmizu/nuxt-prometheus 无法检测到通过 useFetch 或 $fetch 进行的网络请求,因为它们都在内部使用 ofetch。因此,在 /metrics 页面上,您不会看到任何与 ofetch 相关的请求时间。未来的调查将在这里进行此处

目前,请求测量时间默认禁用。

功能

  • 通过 prometheus 中间件导出的默认 NodeJS 指标
  • 关于页面渲染时间和外部请求消耗时间的自定义指标
  • 健康检查中间件

您可以通过模块选项自定义的默认路由

  • /metrics - prometheus 指标
  • /health - 健康检查

安装

通过包管理器安装包

# using nuxi, it automatically appends the module in your nuxt.config
npx nuxi@latest module add prometheus

# using npm
npm install @artmizu/nuxt-prometheus

# using yarn
yarn add @artmizu/nuxt-prometheus

# using pnpm
pnpm add @artmizu/nuxt-prometheus

将其添加到 nuxt 配置文件的 modules 部分

export default {
  modules: ['@artmizu/nuxt-prometheus']
}

Grafana 示例设置

Prometheus 收集指标后,您需要查看它们。我为此目的使用 Grafana,我的指标设置如下所示:封面

选项

您可以通过模块选项和 nuxt 配置属性 prometheus 传递它。

verbose

  • 类型:boolean
  • 默认值:true
  • 描述:开发模式下关于页面渲染时间和外部 API 请求时间的额外日志

healthCheck

  • 类型:boolean
  • 默认值:true
  • 描述:打开或关闭健康检查路由

healthCheckPath

  • 类型:string
  • 默认值:/health
  • 描述:健康检查 URL 路径

prometheusPath

  • 类型:string
  • 默认值:/metrics
  • 描述:Prometheus 导出器 URL 路径

prefix

  • 类型:string
  • 默认值:无前缀
  • 描述:指标名称的可选前缀

enableRequestTimeMeasure