next.jsのカスタムロギング

next.jsカスタムログレコード：不十分なサーバーの終了異常をキャプチャ

next.js自体は、カスタムログレコーダーを使用して、サーバーの不十分な側面の不十分で拒否されることを処理することはできません。 next-loggerなどのライブラリを使用できますが、Pinoの使用に限定されます。他のログライブラリを使用し、DataDogなどのクラウドプロバイダーにログを送信する場合、この方法は無効です。

loglayer logライブラリはこの問題を解決できます。これらの異常をキャプチャして、選択したログライブラリ（PinoやDatadogなど）に送信できます。

ログレイヤーWebサイトを表示して、サポートをサポートするログレコーダーとクラウドプロバイダーを理解します。 インストール

このガイドは、next.jsをセットアップしたことを前提としています。

最初に、必要なソフトウェアパッケージをインストールします。好きな送信方法を使用できます - この例では、Pino：

を使用します。 set

プロジェクトルートディレクトリに検出ファイルを作成する必要があります。

<code class="language-bash">npm i loglayer @loglayer/transport-pino pino serialize-error</code>

テスト

から不十分なエラーを投げる場合、端末に次のことを見る必要があります。

詳細

<code class="language-typescript">// instrumentation.ts
import { LogLayer, type ILogLayer } from 'loglayer';
import { PinoTransport } from "@loglayer/transport-pino";
import pino from "pino";
import { serializeError } from "serialize-error";

/**
 * 去除字符串中的ANSI代码，这是Next.js喜欢注入的内容。
 */
function stripAnsiCodes(str: string): string {
  return str.replace(
    /[\u001b\u009b][[()#;?]*(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?[0-9A-ORZcf-nqry=>/,
    ''
  );
}

function createConsoleMethod(log: ILogLayer, method: string) {
  const mappedMethod = method === "error" ? "errorOnly" : method;
  return (...args: unknown[]): void => {
    const data: Record<string, unknown> = {};
    let hasData = false;
    let error: Error | null = null;
    const messages: string[] = [];

    for (const arg of args) {
      if (arg instanceof Error) {
        error = arg;
        continue;
      }

      if (typeof arg === "object" && arg !== null) {
        Object.assign(data, arg);
        hasData = true;
        continue;
      }

      if (typeof arg === "string") {
        messages.push(arg);
      }
    }

    let finalMessage = stripAnsiCodes(messages.join(" ")).trim();

    // next.js在错误对象时使用“x”作为错误消息
    if (finalMessage === "⨯" && error) {
      finalMessage = error?.message || "";
    }

    if (error && hasData && messages.length > 0) {
      log.withError(error).withMetadata(data)[mappedMethod](finalMessage);
    } else if (error && messages.length > 0) {
      log.withError(error)[mappedMethod](finalMessage);
    } else if (hasData && messages.length > 0) {
      log.withMetadata(data)[mappedMethod](finalMessage);
    } else if (error && hasData && messages.length === 0) {
      log.withError(error).withMetadata(data)[mappedMethod]("");
    } else if (error && messages.length === 0) {
      log.errorOnly(error);
    } else if (hasData && messages.length === 0) {
      log.metadataOnly(data);
    } else {
      log[mappedMethod](finalMessage);
    }
  };
}

export async function register() {
  const logger = new LogLayer({
    errorSerializer: serializeError,
    transport: [
      new PinoTransport({
        logger: pino(),
      }),
    ]
  });

  if (process.env.NEXT_RUNTIME === "nodejs") {
    console.error = createConsoleMethod(logger, "error");
    console.log = createConsoleMethod(logger, "log");
    console.info = createConsoleMethod(logger, "info");
    console.warn = createConsoleMethod(logger, "warn");
    console.debug = createConsoleMethod(logger, "debug");
  }
}</code>

loglayer

loglayer next.js統合ガイド。

page.tsx

<code class="language-json">{"err":{"type":"Object","message":"test","stack":"Error: test\n    at Page (webpack-internal:///(rsc)/./src/app/page.tsx:12:11)","digest":"699232626","name":"Error"},"msg":"test"}</code>

以上がnext.jsのカスタムロギングの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。