Next.js 連携が Node.js Agent に統合されました

Next.js の連携方法が Node.js Agent v12.0.0 移行変わりました

Publié 29 oct 2024 Lecture : 4 min

Node.js Agent v12.0.0 のリリースで Next.js の連携方法が従来の newrelic-node-next から node-newrelic のみを利用する方法に変わりましたのでその設定例を本記事ではご紹介します。

Node.js Agent v12.0.0 のリリースノートも併せてご確認ください。

https://docs.newrelic.com/docs/release-notes/agent-release-notes/nodejs-release-notes/node-agent-12-0-0/

変更点

今までは@newrelic/next を利用する形で呼び出していましたがこれからは newrelic を呼び出すだけで Next.js の計測が可能になりました。

package.json で呼びしている npm scripts の NODE_OPTIONS を更新します。

  "scripts": {
    ...
    "start": "NODE_OPTIONS='-r @newrelic/next' next start",
    ...
  },

↓

  "scripts": {
    ...
    "start": "NODE_OPTIONS='-r newrelic' next start",
    ...
  },

この状態で npm run dev などでサービスを起動して問題なく計測されれば対応としては完了です。

次に App Router のケースの計測方法の変更点を紹介します。

App Router の計測

今回は App Router を利用している場合のケースについて紹介をします。

過去の連携方法についてはHow to monitor a Next.js application with app-based routerのブログに記載がありますのでそちらも見て頂くと本記事の理解が深まります。

next.config.js の設定が今回の大きな変更点です。

これまでは

'use strict'

const nrExternals = require('@newrelic/next/load-externals')

module.exports = {
  experimental: {
    serverComponentsExternalPackages: ['newrelic']
  },
  webpack: (config) => {
    nrExternals(config)
    return config
  }
}

このような形で @newrelic/next に依存していましたがこれからは

'use strict'

const nrExternals = require('newrelic/load-externals')

module.exports = {
  experimental: {
    serverComponentsExternalPackages: ['newrelic']
  },

  webpack: (config) => {
    nrExternals(config)
    return config
  }
}

このような形で newrelic を利用するようにすることでこれまで同様に App Router を利用しているケースも計測が引き続き可能です。

この状態で今までのようにサービスを起動してください。

アプリケーションを起動してこれまで同様に計測ができていれば対応としては完了です。

本記事と近しい設定をしている Github のリポジトリがありますのでそちらも最後に紹介します。
https://github.com/newrelic/newrelic-node-examples/blob/main/nextjs/nextjs-app-router/README.md

本記事の内容としては以上になります。

Étapes suivantes

本記事は APM での計測のご紹介になりました。

Browser Agent での Session Replay や分散トレースもあわせて利用することでフロントエンド、バックエンドあわせて観測することが可能になります。

是非お試しください。

Auteur : 大平譲, Solutions Consultant

New Relic株式会社 Solution Consultant。B to B SaaS の企業で SRE のポジションで Software Engineer として従事してから現職。Kubernetes を使ったコンテナ環境の基盤構築や Terraform を使用した IaC などが得意領域。

Les opinions exprimées sur ce blog sont celles de l'auteur et ne reflètent pas nécessairement celles de New Relic. Toutes les solutions proposées par l'auteur sont spécifiques à l'environnement et ne font pas partie des solutions commerciales ou du support proposés par New Relic. Veuillez nous rejoindre exclusivement sur l'Explorers Hub (discuss.newrelic.com) pour toute question et assistance concernant cet article de blog. Ce blog peut contenir des liens vers du contenu de sites tiers. En fournissant de tels liens, New Relic n'adopte, ne garantit, n'approuve ou n'approuve pas les informations, vues ou produits disponibles sur ces sites.

780+ intégrations pour lancer le monitoring de votre stack gratuitement.

Voir les intégrations

In this article

Next.js 連携が Node.js Agent に統合されました

Next.js の連携方法が Node.js Agent v12.0.0 移行変わりました

変更点

App Router の計測

Étapes suivantes

Tags

Voir aussi