feat: integrate Sentry SDK for web and API

Add @sentry/nextjs with instrumentation hooks and global error boundary.
Add @sentry/hono middleware for the Cloudflare Workers API. DSN is read
only from environment variables so secrets stay out of the repository.

Author: cursoragent

.env.example

@@ -33,10 +33,12 @@ LOG_LEVEL=debug
 # アプリケーション名（マニフェストとメタデータに使用）
 NEXT_PUBLIC_APP_NAME=Sonory
 
-# オブザーバビリティ（APM）
-# ブラウザ + Next.js: https://sentry.io でプロジェクト作成後に設定
+# オブザーバビリティ（Sentry）
+# 1. https://sentry.io でプロジェクト作成（web: Next.js / api: Cloudflare Workers）
+# 2. 以下をローカル .env または Cloudflare / wrangler secret に設定（チャット等で共有しない）
 NEXT_PUBLIC_SENTRY_DSN=
-# Cloudflare Workers API: wrangler secret put SENTRY_DSN --env production
 SENTRY_DSN=
-# 本番以外で Sentry へ送る場合は true（通常は未設定で development はローカルのみ）
-# NEXT_PUBLIC_SENTRY_ENABLED=false
+# ソースマップ自動アップロード（任意・CI 向け）
+SENTRY_ORG=
+SENTRY_PROJECT=
+SENTRY_AUTH_TOKEN=

apps/api/package.json

@@ -27,6 +27,8 @@
    "dependencies": {
       "@hono/zod-openapi": "^1.4.0",
       "@hono/zod-validator": "^0.8.0",
+      "@sentry/cloudflare": "^10.56.0",
+      "@sentry/hono": "^10.56.0",
       "@sonory/shared-types": "file:../../packages/shared-types",
       "@sonory/utils": "file:../../packages/utils",
       "@supabase/supabase-js": "^2.108.0",

apps/api/src/app.ts

@@ -1,4 +1,5 @@
 import { OpenAPIHono } from "@hono/zod-openapi"
+import { sentry } from "@sentry/hono/cloudflare"
 import { logger as honoLogger } from "hono/logger"
 import { requestId } from "hono/request-id"
 import { timing } from "hono/timing"
@@ -10,13 +11,19 @@ import { healthRoutes } from "./routes/health"
 import pinsRoutes from "./routes/pins"
 import type { Env } from "./types/env"
 import { logger } from "./utils/logger"
+import { createSentryOptions } from "./utils/sentryOptions"
 
 /**
  * OpenAPIHono アプリケーションを構築する。
  */
 export function createApp(): OpenAPIHono<{ Bindings: Env }> {
    const app = new OpenAPIHono<{ Bindings: Env }>()
 
+   app.use(
+      "*",
+      sentry(app, (env: Env) => createSentryOptions(env)),
+   )
+
    app.use("*", requestId())
    app.use("*", timing())
    app.use("*", honoLogger())

apps/api/src/middleware/error.ts

@@ -2,6 +2,8 @@ import type { APIError } from "@sonory/shared-types"
 import { ERROR_CODES } from "@sonory/shared-types"
 import type { Context, Next } from "hono"
 import { HTTPException } from "hono/http-exception"
+import type { Env } from "../types/env"
+import { captureException } from "../utils/telemetry"
 
 // ERROR_CODESを再エクスポート
 export { ERROR_CODES }
@@ -85,6 +87,16 @@ export const errorHandler = async (c: Context, next: Next) => {
 
       // その他のエラー
       console.error("Unhandled error:", error)
+
+      const env = (c.env ?? {}) as Env
+      if (env.SENTRY_DSN) {
+         await captureException(error, {
+            requestId,
+            path: c.req.path,
+            method: c.req.method,
+         })
+      }
+
       const apiError: APIError = {
          code: ERROR_CODES.INTERNAL_SERVER_ERROR,
          message: "An unexpected error occurred",

apps/api/src/middleware/monitoring.ts

@@ -9,7 +9,7 @@ import { captureException } from "../utils/telemetry"
  * @description
  * Cloudflare Workers環境でのログ・メトリクス・エラー追跡を提供
  * Phase 1: 基本的なログ機能を実装
- * Phase 2以降: Sentry連携やCloudflare Analytics統合を追加予定
+ * Phase 2: Sentry連携（@sentry/hono）済み
  */
 
 /**

apps/api/src/utils/sentryOptions.ts

@@ -0,0 +1,17 @@
+import type { CloudflareOptions } from "@sentry/cloudflare"
+import type { Env } from "../types/env"
+
+/**
+ * Workers 環境向け Sentry オプションを生成する。
+ */
+export function createSentryOptions(env: Env): CloudflareOptions {
+   const isProduction = env.ENVIRONMENT === "production"
+
+   return {
+      dsn: env.SENTRY_DSN,
+      enabled: Boolean(env.SENTRY_DSN),
+      environment: env.ENVIRONMENT,
+      tracesSampleRate: isProduction ? 0.1 : 1,
+      sendDefaultPii: false,
+   }
+}

apps/api/src/utils/telemetry.ts

@@ -1,20 +1,19 @@
+import * as Sentry from "@sentry/cloudflare"
 import type { LogContext } from "@sonory/utils"
 
 /**
- * Workers 向けのエラー転送先。
- *
- * @description
- * Phase 2: `@sentry/cloudflare` 導入後に実装を差し替える。
+ * Workers 向けのエラー転送。
  */
 export async function captureException(
    error: unknown,
    context?: LogContext,
 ): Promise<void> {
-   // Sentry DSN 設定後:
-   // import * as Sentry from "@sentry/cloudflare"
-   // Sentry.captureException(error, { extra: context })
-   void error
-   void context
+   if (context === undefined) {
+      Sentry.captureException(error)
+      return
+   }
+
+   Sentry.captureException(error, { extra: { ...context } })
 }
 
 /**

apps/api/tsconfig.json

@@ -6,7 +6,7 @@
       "lib": ["ES2022"],
       "types": ["./worker-configuration.d.ts", "node"],
       "jsx": "react-jsx",
-      "moduleResolution": "node",
+      "moduleResolution": "bundler",
       "allowImportingTsExtensions": false,
       "noPropertyAccessFromIndexSignature": false,
       "moduleDetection": "force",

apps/web/instrumentation-client.ts

@@ -0,0 +1,9 @@
+import * as Sentry from "@sentry/nextjs"
+
+import { getSentryOptions, isSentryEnabled } from "./sentry.shared.config"
+
+if (isSentryEnabled()) {
+   Sentry.init(getSentryOptions())
+}
+
+export const onRouterTransitionStart = Sentry.captureRouterTransitionStart

apps/web/instrumentation.ts

@@ -0,0 +1,16 @@
+import * as Sentry from "@sentry/nextjs"
+
+/**
+ * Next.js サーバー・Edge ランタイム向け Sentry 登録フック。
+ */
+export async function register(): Promise<void> {
+   if (process.env.NEXT_RUNTIME === "nodejs") {
+      await import("./sentry.server.config")
+   }
+
+   if (process.env.NEXT_RUNTIME === "edge") {
+      await import("./sentry.edge.config")
+   }
+}
+
+export const onRequestError = Sentry.captureRequestError