Sentry, Bugsnag & Datadog RUM ব্রিজ

ফ্রন্টএন্ড JavaScript এক্সেপশন সরাসরি MousePlayer-এর ভিডিও সেশন রেকর্ডিংয়ের সঙ্গে যুক্ত করে প্রকৌশল ও QA কাজ দ্রুত করুন।

1. সমস্যা: স্ট্যাকট্রেস ব্যবহারকারীর প্রেক্ষাপট দেখায় না

আপনার ওয়েবসাইটে সামলানো হয়নি এমন JavaScript এক্সেপশন বা নেটওয়ার্ক ক্র্যাশ হলে Sentry-এর মতো ত্রুটি পর্যবেক্ষণ সরঞ্জাম শুষ্ক স্ট্যাকট্রেস ও ব্রাউজারের user-agent লেখা দেয়। কিন্তু প্রকৌশলীদের প্রশ্ন থেকে যায়: “ক্র্যাশের ঠিক আগে ব্যবহারকারী কোন বোতামে ক্লিক করেছেন?” অথবা “ফর্মে কী ডেটা দেওয়া হয়েছিল?”

এই MousePlayer ত্রুটি ট্র্যাকিং ব্রিজ ত্রুটির প্রতিবেদনে সরাসরি দৃশ্যমান রিপ্লে URL যুক্ত করে স্বয়ংক্রিয়ভাবে সমাধান দেয়। এক্সেপশন ঘটলে প্রকৌশলী Sentry বা Bugsnag ড্যাশবোর্ডের একটি লিংকে ক্লিক করে ক্র্যাশের নির্দিষ্ট মিলিসেকেন্ড পর্যন্ত ব্যবহারকারীর স্ক্রিনের ভিডিও রেকর্ডিং দেখতে পারেন।

অতিরিক্ত চাপহীন ইন্টিগ্রেশন: ব্রিজ নীরবে পটভূমির পর্যবেক্ষক হিসেবে চলে এর মধ্যে: mp.js। পরিমাপযোগ্য অতিরিক্ত চাপ বা Core Web Vitals-এ প্রভাব ছাড়া আপনার ত্রুটি ট্র্যাকিং SDK স্বয়ংক্রিয়ভাবে শনাক্ত করে।

2. চালু করা & সেবাদাতার সঙ্গে মেলানো

ড্যাশবোর্ড ইন্টারফেস অথবা SDK কনফিগারেশন অবজেক্ট দিয়ে প্রোগ্রাম করে ত্রুটি ট্র্যাকিং ব্রিজ চালু করতে পারেন।

পদ্ধতি A: ড্যাশবোর্ডে চালু করা (কোড ছাড়া)

  1. MousePlayer ওয়ার্কস্পেসে প্রবেশ করে খুলুন আপনার ওয়েব প্রপার্টি।
  2. ক্লিক করুন সেটিংস / ইন্টিগ্রেশন বোতামে, লক্ষ্য ওয়েবসাইটের পাশে।
  3. ইন্টিগ্রেশন উইন্ডোতে সুইচ বদলান Sentry, Bugsnag & Datadog RUM ব্রিজ এবং সেট করুন এই মানে: ON।
  4. সেবাদাতা বেছে নিন (sentry, bugsnag, অথবা datadog) এবং ক্লিক করুন পরিবর্তন সংরক্ষণ করুন।

পদ্ধতি B: হাতে স্ক্রিপ্ট কনফিগারেশন

কনফিগারেশন সরাসরি কোডে দিতে চাইলে এই মান দিন: error_bridge_active: true আপনার এই window.mp_config অবজেক্টের মধ্যে:

<!-- MousePlayer SDK with Error Tracking Bridge Enabled --> <script> window.mp_config = { channel: 'YOUR_CHANNEL_ID', error_bridge_active: true, error_provider: 'sentry' // 'sentry', 'bugsnag', or 'datadog' }; </script>

3. প্রযুক্তিগত SDK চালানোর টেবিল

নির্বাচিত সেবাদাতা অনুযায়ী MousePlayer স্বয়ংক্রিয়ভাবে অফিসিয়াল JavaScript SDK-এর ট্যাগিং পদ্ধতি চালায়:

সেবাদাতা চালানো JavaScript পদ্ধতি যুক্ত মেটাডেটার কী
Sentry window.Sentry.setTag(...) mouseplayer_session_url
Bugsnag window.Bugsnag.addMetadata('MousePlayer', { ... }) session_url
Datadog RUM window.DD_RUM.setGlobalContextProperty(...) mouseplayer_session_url

4. ত্রুটির প্রতিবেদনে রিপ্লে কোথায় পাবেন

চালু হলে ফ্রন্টএন্ড ক্র্যাশ নথিভুক্ত হলেই ত্রুটি পর্যবেক্ষণের ড্যাশবোর্ডে রিপ্লে URL সঙ্গে সঙ্গে দেখায়।

Sentry সমস্যার বিবরণ

Sentry প্রকল্পে যেকোনো সমস্যা খুলে নিচে স্ক্রল করে যান ট্যাগ বিভাগে। এই নামের ট্যাগ দেখবেন: mouseplayer_session_url। কোয়েরির সার্চ বার দিয়েও Sentry-এর সমস্যা ফিল্টার করতে পারেন: mouseplayer_session_url:*।

Bugsnag মেটাডেটা ট্যাব

Bugsnag ত্রুটির প্রতিবেদনে নিচের নেভিগেশন ট্যাব দেখুন। নতুন কাস্টম ট্যাব দেখাবে এই নামে: MousePlayer , যাতে থাকবে ক্লিকযোগ্য session_url হাইপারলিংক।

Datadog RUM Error Explorer

Datadog RUM-এ রেকর্ড করা যেকোনো ত্রুটির সেশনে গিয়ে দেখুন Global Context / Attributes JSON ট্রি। এই নামের অধীনে URL ইনডেক্স করা থাকে: @mouseplayer_session_url।

এখানে উল্লিখিত সব ট্রেডমার্ক নিজ নিজ মালিকের। এই সেবাদাতাদের সঙ্গে MousePlayer-এর ব্যবসায়িক সম্পর্ক নেই।