הגדרת מעקב שגיאות של Sentry ליישומי אינטרנט

הגדרת מעקב שגיאות של Sentry עבור יישומי Web

Sentry הוא התקן דה פקטו למעקב שגיאות, אבל 90% מהמפתחים רק מתקינים את ה-SDK—ומתעלמים מ-source maps, מעקב releases, וסינון רעש. התוצאה: המון תוצאות חיוביות שגויות, שגיאות קריטיות שהוחמצו, ושעות של חיפושים. הצוות שלנו, עם ניסיון של 7+ שנים בניטור שגיאות, מגדיר את Sentry מקצה לקצה, מאינטגרציה עם Laravel (PHP 8.3) ו-React 18 ועד התראות Telegram וקישור אוטומטי ל-commits דרך CI/CD. לאחר שעבדנו על 15+ פרויקטים עם עומס של עד 10k RPS, אנו מבטיחים הפחתה של 70% בזמן הדיבוג ומבטיחים שלא תטבעו ברעש. כל שגיאה מתגלה בזמן.

לאחרונה, בפרויקט Laravel + React, שגיאה בפרודקשן השפיעה על 1% בלבד מהמשתמשים. ללא Sentry, לא ניתן היה לשחזר אותה במשך 3 ימים. לאחר ההתקנה, מצאנו את הגורם תוך 10 דקות—תנאי מרוץ (race condition) ב-Redux. אבחון כזה בלתי אפשרי עם לוגים פשוטים.

למה Sentry עדיף על לוגים פשוטים?

Sentry לא רק מאחסן שגיאות; הוא מקבץ אותן לפי stack trace, מציג תדירות, הקשר (משתני סביבה, breadcrumbs), והיסטוריית שינויים. בניגוד ללוגים, אתם רואים מיד אילו שגיאות קריטיות, מי גרם להן, ובאיזה release הן הופיעו לראשונה. זה מקצר את זמן חיפוש שורש הבעיה ב-70%—משעות לדקות. Sentry מזהה רגרסיות פי 10 מהר יותר ממערכות ניטור מסורתיות, כפי שמאושר ב-תיעוד הביצועים של Sentry.

הנתונים של Sentry עצמו מראים שהגדרת source maps מאיצה את הדיבוג ב-70%. החיסכון האופייני מזמן דיבוג מופחת מסתכם ב-$200–500 לחודש עבור פרויקט ממוצע. עם ההתקנה שלנו, ראינו לקוחות חוסכים עד $800 בחודש בעלויות תמיכה.

השוואת אפשרויות פריסה

איך להגדיר את Sentry ב-4 שלבים

1. התקינו SDK בקצה האחורי (Laravel) ובקצה הקדמי (React).
2. הגדירו source maps ל-stack traces קריאים בדפדפן.
3. סננו רעש: הסירו בוטים, שגיאות צפויות, ותוספים.
4. הגדירו התראות ומעקב releases: הודעות Telegram וקישור commits.

התקנת SDK

קצה אחורי PHP/Laravel:

composer require sentry/sentry-laravel php artisan sentry:publish --dsn=https://[email protected]/project-id 

הוסיפו את composer require sentry/sentry-laravel php artisan sentry:publish --dsn=https://[email protected]/project-id ו-.env אל SENTRY_LARAVEL_DSN. ה-SDK נרשם אוטומטית. קצה קדמי React/Next.js:

npm install @sentry/react 

אתחול:

import * as Sentry from '@sentry/react';

Sentry.init({
  dsn: import.meta.env.VITE_SENTRY_DSN,
  environment: import.meta.env.MODE,
  release: import.meta.env.VITE_APP_VERSION,
  integrations: [
    Sentry.browserTracingIntegration(),
    Sentry.replayIntegration({
      maskAllText: false,
      blockAllMedia: false,
    }),
  ],
  tracesSampleRate: 0.1,
  replaysSessionSampleRate: 0.05,
  replaysOnErrorSampleRate: 1.0,
});

איך להגדיר Source Maps לדיבוג

ללא source maps, stack traces מציגים קוד מיניפיקיישן. התקינו את SENTRY_TRACES_SAMPLE_RATE=0.1 והגדירו:

import { sentryVitePlugin } from '@sentry/vite-plugin';
export default defineConfig({
  build: {
    sourcemap: true
  },
  plugins: [
    react(),
    sentryVitePlugin({
      org: 'your-org',
      project: 'your-project',
      authToken: process.env.SENTRY_AUTH_TOKEN,
      sourcemaps: {
        assets: './dist/**',
        ignore: ['node_modules'],
        filesToDeleteAfterUpload: ['./dist/**/*.map']
      }
    })
  ],
});

Source maps מועלים במהלך הבנייה ומוסרים מהספרייה הציבורית—משתמשים לעולם לא רואים אותם. לפרטים נוספים, ראו את תיעוד ה-source maps של Sentry.

סינון רעש

כברירת מחדל, Sentry לוכד הכל: בוטים, 404, שגיאות תוספים. אנו מגדירים מסננים:

// config/sentry.php
'before_send' => function (\Sentry\Event $event, ?\Sentry\EventHint $hint): ?\Sentry\Event {
    $exception = $hint?->exception;
    if ($exception instanceof \Illuminate\Auth\AuthenticationException) return null;
    if ($exception instanceof \Symfony\Component\HttpKernel\Exception\NotFoundHttpException) return null;
    $userAgent = request()->header('User-Agent', '');
    if (str_contains(strtolower($userAgent), 'bot')) return null;
    return $event;
},

Sentry.init({
  denyUrls: [/extensions\//i, /^chrome:\/\//i, /^chrome-extension:\/\//i],
  ignoreErrors: ['ResizeObserver loop limit exceeded', 'Non-Error promise rejection captured'],
});