mcpField
U
using-sentry

using-sentry

github.com/andrelandgraf开发2396 次安装20 周前更新
代码仓库

关于 using-sentry

面向使用 Sentry 的开发者,提供错误捕获、上下文补充、性能追踪和结构化日志的实践指导。内容包含可用于 Next.js 的 SDK 示例,也涵盖面包屑与用户上下文管理。

主要功能

  1. 01手动捕获异常
  2. 02附加用户与自定义上下文
  3. 03为操作创建性能 Span
  4. 04记录结构化日志
  5. 05添加错误面包屑
  6. 06登出时清除用户上下文

适用场景

  1. 01追踪已处理但仍需记录的错误
  2. 02为错误事件补充用户信息
  3. 03测量异步操作的性能
  4. 04记录支付等业务事件

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/andrelandgraf/fullstackrecipes --skill using-sentry

安装后在 Claude Code 中输入/using-sentry确认已加载。

详细介绍

使用 Sentry

使用 Sentry 捕获异常、添加上下文、创建性能 Span,并进行结构化日志记录。

使用 Sentry

使用 Sentry 捕获异常、添加上下文、创建性能 Span,并进行结构化日志记录。

参见:


捕获异常

手动捕获已处理但仍需跟踪的错误:

import * as Sentry from "@sentry/nextjs";

try {
  await riskyOperation();
} catch (err) {
  Sentry.captureException(err);
  // Handle the error gracefully...
}
添加上下文

为错误附加用户上下文和自定义上下文:

import * as Sentry from "@sentry/nextjs";

// Set user context (persists for session)
Sentry.setUser({
  id: session.user.id,
  email: session.user.email,
});

// Add custom context to exceptions
Sentry.captureException(err, {
  tags: {
    feature: "checkout",
    plan: "pro",
  },
  extra: {
    orderId: "order_123",
    items: cart.items,
  },
});
性能跟踪

为有意义的操作创建 Span:

import * as Sentry from "@sentry/nextjs";

// Wrap async operations
const result = await Sentry.startSpan(
  {
    op: "http.client",
    name: "GET /api/users",
  },
  async () => {
    const response = await fetch("/api/users");
    return response.json();
  },
);

// Wrap sync operations
Sentry.startSpan(
  {
    op: "ui.click",
    name: "Submit Button Click",
  },
  (span) => {
    span.setAttribute("form", "checkout");
    processSubmit();
  },
);
使用 Sentry Logger

Sentry 提供结构化日志记录,这些日志会显示在 Logs 标签页中:

import * as Sentry from "@sentry/nextjs";

const { logger } = Sentry;

logger.info("Payment processed", { orderId: "123", amount: 99.99 });
logger.warn("Rate limit approaching", { current: 90, max: 100 });
logger.error("Payment failed", { orderId: "123", reason: "declined" });
面包屑

添加面包屑,为错误提供上下文:

import * as Sentry from "@sentry/nextjs";

// Automatically captured: console logs, fetch requests, UI clicks
// Manual breadcrumbs for custom events:
Sentry.addBreadcrumb({
  category: "auth",
  message: "User signed in",
  level: "info",
});
清除用户上下文

退出登录时清除用户数据:

import * as Sentry from "@sentry/nextjs";

async function signOut() {
  Sentry.setUser(null);
  await authClient.signOut();
}

参考资料

评论

支持 Markdown