Sentry لـ Angular

تتبّع أخطاء Angular يكتشف العلل قبل مستخدميك

حزمة Angular SDK مع مزوّد ErrorHandler وتجهيز للموجّه ومعترض HTTP — إضافة إلى إعادة تشغيل الجلسات وstack traces مقروءة عبر source maps على المنصة نفسها. استدعِ init قبل الإقلاع، وسجّل المزوّدات، وسيصل كل خطأ غير معالَج إلى لوحتك ومعه الرحلة التي سبقته.

لماذا تحتاج تطبيقات Angular إلى تتبّع أخطاء حقيقي

تتعطّل تطبيقات Angular بصمت في الإنتاج. استثناء غير معالَج في مكوّن يكسر سير عمل لمستخدم في منطقة زمنية أخرى، وتختفي رسالة الـ console مع إغلاق تبويبه، وأول إشارة تصلك هي تذكرة دعم بلا خطوات لإعادة الإنتاج. وتزيد حزم الإنتاج المصغّرة الأمر سوءًا — فـ stack trace يشير إلى السطر الأول من main.7d4f9b.js لا يخبرك شيئًا عن المكوّن أو المسار أو نداء HTTP الذي فشل فعلًا.

ثبّت حِزمة @sentry/angular الرسمية وهيّئها باستخدام DSN من إعداد مشروع AllStak قبل الإقلاع. فعّل فقط تكاملات Angular الرسمية المعتمدة في مصفوفة التوافق الحالية.

مراقبة شاملة لـ Angular

من استثناء غير معالَج في مكوّن إلى نداء HTTP خلفه، يغطّي AllStak تطبيق Angular لديك عبر كل طبقة.

تتبّع الأخطاء

استخدم تكامل Angular الرسمي للأخطاء غير المعالَجة واستدعِ Sentry.captureException للإخفاقات التي تعالجها بنفسك.

إعادة تشغيل الجلسات

شاهد ما فعله المستخدم فعلًا قبل الخطأ — النقرات والتنقّل ولحظة العطل — مع إخفاء للخصوصية يضمن ألّا تغادر المدخلات الحساسة المتصفّح.

خرائط المصدر

ارفع source maps فتُحَلّ stack traces الإنتاج المصغّرة إلى شيفرة TypeScript الأصلية — الملف والسطر والدالة — فيبدأ الإصلاح فورًا.

تجهيز الموجّه

استخدم تكامل موجّه Angular الرسمي من Sentry لتتبّع التنقّل المدعوم، ثم تحقق من الأحداث الناتجة مقابل مصفوفة توافق AllStak.

معترض HTTP

استخدم تكامل تتبّع المتصفح الرسمي من Sentry للـ spans المدعومة للطلبات الصادرة، واحصر أهداف التتبّع في قائمة سماح ضيقة.

التنبيهات والحوادث

تلقَّ إشعارًا لحظة ظهور خطأ جديد أو ارتفاع خطأ قديم — قبل وصول تذاكر الدعم لا بعدها.

أضف AllStak خلال دقائق

ثبّت من npm واستدعِ init في main.ts قبل إقلاع التطبيق — ثم سجّل مزوّدات الـ standalone للأخطاء والتوجيه وHTTP.

main.ts
npm install @sentry/angular

import * as Sentry from '@sentry/angular';
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { appConfig } from './app/app.config';

Sentry.init({ dsn: globalThis._importMeta_.env.VITE_ALLSTAK_DSN, environment: 'production' });

bootstrapApplication(AppComponent, appConfig);

اتبع إعداد @sentry/angular الرسمي لإصدار Angular لديك، واحفظ DSN الخاص بـ AllStak في إعدادات التشغيل، وتحقق من خطأ تجريبي معالج وآخر غير معالج قبل التعميم. دليل الإعداد الكامل ومرجع الـ SDK.

ما تراه في AllStak

تفاصيل الخطأ مع سياق كامل

افتح أي مشكلة لترى stack trace مقروءًا (عبر source maps)، والـ breadcrumbs التي سبقته، والإصدار الذي وصل فيه — إعادة إنتاج دون تخمين.

إعادة تشغيل جلسة العطل

شاهد جلسة المستخدم حول لحظة الخطأ — ما الذي نقر عليه، وأين تنقّل، وكيف بدت الصفحة عندما تعطّلت.

المسارات ونداءات HTTP معًا

يضع تجهيز الموجّه ومعترض HTTP كل تنقّل وكل طلب صادر إلى جانب الأخطاء المرتبطة بها — فلا يبقى نداء API الفاشل لغزًا أبدًا.

لوحة تحكّم موحّدة آنية

أخطاء الواجهة الأمامية إلى جانب أخطاء الخلفية والسجلات وتوافر الـ APIs خلفها — لوحة واحدة، بالعربية أو الإنجليزية، للفريق بأكمله.

لماذا تختار الفرق AllStak لـ Angular

  • الواجهة الأمامية والخلفية على منصة واحدة — الأخطاء والسجلات والتوافر والبنية التحتية بفاتورة واحدة.
  • دوال مزوّدات standalone تناسب Angular الحديث — سجّلها مرة واحدة في appConfig وستكون مغطًّى.
  • تحوّل إعادة تشغيل الجلسات وsource maps بلاغات الأخطاء الغامضة إلى أدلة مرئية ومقروءة.
  • يلتقط تجهيز الموجّه ومعترض HTTP الرحلة كاملة — دون تجهيز لكل نداء.
  • تسعير واضح بالريال السعودي مع باقة مجانية حقيقية — ابدأ دون بطاقة ائتمان.
  • تبقى بياناتك داخل السعودية، مع لوحة تحكّم بالعربية والإنجليزية للفريق بأكمله.

أسئلة شائعة حول مراقبة Angular

كيف أضيف تتبّع الأخطاء إلى تطبيق Angular؟

ثبّت @sentry/angular من npm وهيّئه باستخدام DSN من إعداد مشروع AllStak قبل bootstrapApplication. سجّل فقط تكاملات Angular الرسمية المدعومة في مصفوفة التوافق الحالية.

هل يعمل AllStak مع مكوّنات Angular المستقلة (standalone)؟

نعم. استخدم تعليمات الإقلاع المستقل المنشورة لحِزمة @sentry/angular الرسمية، ثم تحقق من التقاط الأخطاء وأي تكامل اختياري للتوجيه مقابل مصفوفة توافق AllStak.

هل AllStak مجاني لـ Angular؟

نعم. يوفّر AllStak باقة مجانية يمكنك البدء بها دون بطاقة ائتمان، وحِزمة Sentry الرسمية لـ Angular مفتوحة المصدر.

هل AllStak بديل لـ Sentry في Angular؟

نعم. تحصل على تتبّع أخطاء Angular مع source maps وإعادة تشغيل الجلسات كما في Sentry، إضافة إلى السجلات والتوافر ومراقبة البنية التحتية لخلفيتك على المنصة نفسها — بفاتورة واحدة بالريال السعودي وبيانات مخزّنة داخل السعودية بدلًا من كومة أدوات منفصلة.

هل ستُبطئ حزمة الـ SDK تطبيق Angular لديّ؟

صُمّمت الحزمة لمتصفّحات الإنتاج: فخطّافات الالتقاط خفيفة وتُرسَل القياسات في الخلفية، فلا تتأثر تجربة مستخدميك بشكل ملموس. وأنت تختار بدقة ما يُجهَّز — فكل مزوّد (معالج الأخطاء، الموجّه، معترض HTTP) يُسجَّل على حدة.

ابدأ تتبّع أخطاء Angular اليوم

استدعِ init، وسجّل المزوّدات، وانشر — وشاهد الأخطاء والمسارات والجلسات تصل إلى لوحة واحدة. ابدأ مجانًا — دون الحاجة إلى بطاقة ائتمان.