要点OpenTelemetry Nginx モジュール を使用して、Nginx の分散トレースを ClickStack に取り込みます。デモデータセットとあらかじめ用意されたダッシュボードも含まれています。
既存のNginxとのインテグレーション
前提条件
- OTLP エンドポイントにアクセス可能な状態で稼働している ClickStack インスタンス (ポート 4317/4318)
- 既存の Nginx インストール (バージョン 1.18 以上)
- Nginx の設定を変更するための root または sudo 権限
- ClickStack のホスト名または IP アドレス
OpenTelemetry Nginx モジュールをインストールする
Nginx にトレーシングを追加する最も簡単な方法は、OpenTelemetry サポートが組み込まれた公式の Nginx イメージを使用することです。nginx:otel イメージを使用する
現在の Nginx イメージを OpenTelemetry 対応版に置き換えます。ngx_otel_module.so があらかじめインストールされており、すぐに使用できます。Docker の外で Nginx を実行している場合は、手動インストールの手順について OpenTelemetry Nginx documentation を参照してください。
Nginx が ClickStack にトレースを送信するよう設定する
nginx.conf ファイルに OpenTelemetry の設定を追加します。この設定では、モジュールを読み込み、トレースを ClickStack の OTLP エンドポイントに送信します。まず、API key を取得します。- ClickStack の URL で HyperDX を開きます
- Settings → API Keys に移動します
- インジェスト API key をコピーします
- 環境変数として設定します:
export CLICKSTACK_API_KEY=your-api-key-here
nginx.conf に追加します。<clickstack-host> は、ClickStack インスタンスのホスト名または IP アドレスに置き換えてください。- Port 4317 は、Nginx モジュールが使用する gRPC エンドポイントです
- otel_service_name には、Nginx インスタンスがわかる名前を設定してください (例: “api-gateway”、“frontend-proxy”)
- HyperDX で識別しやすくするため、環境に合わせて otel_service_name を変更してください
設定内容を理解する
トレースされる内容: Nginx への各リクエストごとに、次を示す trace span が作成されます。- リクエストメソッドとパス
- HTTP ステータスコード
- リクエスト時間
- タイムスタンプ
otel_span_attr ディレクティブは各トレースにメタデータを追加し、ステータスコード、メソッド、ルートなどで HyperDX 内のリクエストを絞り込んで分析できるようにします。これらの変更を行った後、Nginx の設定をテストします。HyperDX でトレースを確認する
設定が完了したら、HyperDX にログインしてトレースが流れていることを確認します。次のような表示になるはずです。トレースが表示されない場合は、時間範囲を調整してみてください。デモデータセット
ClickStack を起動する
まだ ClickStack を起動していない場合は、次のコマンドを実行します。- ポート 8080: HyperDX の Web インターフェイス
- ポート 4317: OTLP gRPC エンドポイント (nginx モジュールで使用)
- ポート 4318: OTLP HTTP endpoint (デモトレースで使用)
サンプルデータセットをダウンロードする
サンプルトレースファイルをダウンロードし、timestamp を現在時刻に更新します。- 現実的なタイミングの 1,000 件のトレーススパン
- 異なるトラフィックパターンを持つ 9 種類の endpoint
- 約 93% の成功 (200) 、約 3% のクライアントエラー (404) 、約 4% のサーバーエラー (500)
- 10ms 〜 800ms のレイテンシ
- 元のトラフィックパターンを維持したまま、現在時刻にシフト
トレースを ClickStack に送信する
API key を環境変数として設定します (まだ設定していない場合) 。- ClickStack の URL で HyperDX を開きます
- Settings → API Keys に移動します
- インジェスト API key をコピーします
localhost で実行する場合このデモは、ClickStack が
localhost:4318 でローカル実行されていることを前提としています。リモートのインスタンスを使用する場合は、localhost を ClickStack の hostname に置き換えてください。{"partialSuccess":{}} のようなレスポンスが返るはずです。1,000 件すべてのトレースが ClickStack に取り込まれます。HyperDX でトレースを確認する
- HyperDX を開いてアカウントにログインします (先にアカウントの作成が必要な場合があります)
- Search view に移動し、source を
Tracesに設定します - 時間範囲を 2025-10-25 13:00:00 - 2025-10-28 13:00:00 に設定します
タイムゾーン表示HyperDX は timestamp をブラウザーのローカル timezone で表示します。デモデータの期間は 2025-10-26 13:00:00 - 2025-10-27 13:00:00 (UTC) です。広めの時間範囲を設定しているため、どの地域からでもデモトレースを確認できます。トレースが表示されたら、より見やすく可視化するために範囲を 24 時間に絞ることができます。
ダッシュボードと可視化
ダッシュボード設定をします
あらかじめ用意されたダッシュボードをインポートします
- HyperDX を開き、Dashboards セクションに移動します。
- 右上の三点メニューから “Import Dashboard” をクリックします。
- nginx-trace-dashboard.json ファイルをアップロードし、インポートを完了します。
すべての可視化が事前設定された状態でダッシュボードが作成されます。
デモデータセットでは、時間範囲を 2025-10-26 13:00:00 - 2025-10-27 13:00:00 (UTC) に設定してください (ローカルのタイムゾーンに応じて調整してください) 。インポートしたダッシュボードには、デフォルトでは時間範囲が設定されていません。