Afárá Sentry, Bugsnag & Datadog RUM

Ẹ mú ọ̀nà iṣẹ́ onímọ̀ ẹ̀rọ àti QA yín yára sí i nípa sísopọ̀ àṣìṣe JavaScript front-end tààrà mọ́ ìgbàsílẹ̀ ìgbà ìlò fídíò MousePlayer.

1. Ìṣòro: stacktrace kò fi àyíká olùlò hàn

Nígbà tí àṣìṣe JavaScript tí a kò bójú tó tàbí ìkùnà nẹ́tíwọ́ọ̀kì bá ṣẹlẹ̀ lórí ojúlé wẹ́ẹ̀bù yín, irinṣẹ́ àbójútó àṣìṣe bí Sentry ń pèsè stacktrace àti user-agent aṣàwákiri lásán. Síbẹ̀, onímọ̀ ẹ̀rọ ṣì ń béèrè: “Bọ́tìnnì wo ni olùlò tẹ̀ ní kété ṣáájú ìkùnà?” tàbí “Dátà wo ni a tẹ sínú fọ́ọ̀mù?”

Afárá ìtọ́pa àṣìṣe MousePlayer ń yanjú èyí fúnra rẹ̀ nípa sísopọ̀ URL ìtúnṣeré àwòrán tààrà sínú ìròyìn àṣìṣe yín. Nígbà tí àṣìṣe bá ṣẹlẹ̀, onímọ̀ ẹ̀rọ lè tẹ ìjápọ̀ kan nínú dashboard Sentry tàbí Bugsnag wọn, kí ó sì wo ìgbàsílẹ̀ fídíò ojú ìbòjú olùlò títí dé mílíìṣẹ́jú àáyá gangan ìkùnà.

Ìsopọ̀ láìsí ẹrù àfikún: Afárá ń ṣiṣẹ́ láìpariwo gẹ́gẹ́ bí olùṣọ́ abẹ́lẹ̀ nínú mp.js. Ó ń rí SDK ìtọ́pa àṣìṣe yín fúnra rẹ̀ láìfi ẹrù àfikún tó ṣeé wọn kún un tàbí láìkan Core Web Vitals.

2. Ìmúṣiṣẹ́ & ìbámu olùpèsè

Ẹ lè mú afárá ìtọ́pa àṣìṣe ṣiṣẹ́ nípasẹ̀ ojú ìṣàkóso dashboard yín tàbí nípa ètò nípasẹ̀ ohun ìṣètò SDK wa.

Ọ̀nà A: ìmúṣiṣẹ́ Dashboard (láìsí kóòdù)

  1. Ẹ wọlé sí àgbègbè iṣẹ́ MousePlayer yín kí ẹ sì ṣí Ojúlé yín.
  2. Ẹ tẹ bọ́tìnnì Ètò / Ìsopọ̀ lẹ́gbẹ̀ẹ́ ojúlé wẹ́ẹ̀bù àfojúsùn yín.
  3. Nínú fèrèsé Ìsopọ̀, ẹ yí Afárá Sentry, Bugsnag & Datadog RUM sí ON.
  4. Ẹ yan olùpèsè yín (sentry, bugsnag tàbí datadog), kí ẹ sì tẹ Fi àyípadà pamọ́.

Ọ̀nà B: ìṣètò síkírípù fúnra yín

Bí ẹ bá fẹ́ kọ ìṣètò sínú kóòdù, ẹ fi error_bridge_active: true sínú ohun window.mp_config yín:

<!-- 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. Tábìlì ìṣiṣẹ́ SDK ẹ̀rọ

Gẹ́gẹ́ bí olùpèsè tí ẹ yàn, MousePlayer ń ṣiṣẹ́ ọ̀nà tagging JavaScript SDK tí olùpèsè fọwọ́ sí fúnra rẹ̀:

Olùpèsè Ọ̀nà JavaScript tí a ṣiṣẹ́ Metadata key tí a fi sínú rẹ̀
Sentry window.Sentry.setTag(...) mouseplayer_session_url
Bugsnag window.Bugsnag.addMetadata('MousePlayer', { ... }) session_url
Datadog RUM window.DD_RUM.setGlobalContextProperty(...) mouseplayer_session_url

4. Ibi tí a ti rí ìtúnṣeré nínú ìròyìn àṣìṣe yín

Ní kété tí ó ń ṣiṣẹ́, URL ìtúnṣeré ń hàn lẹ́sẹ̀kẹsẹ̀ nínú dashboard àbójútó àṣìṣe yín ní gbogbo ìgbà tí a bá kọ ìkùnà front-end sílẹ̀.

Kúlẹ̀kúlẹ̀ ọ̀ràn Sentry

Ẹ ṣí ọ̀ràn èyíkéyìí nínú iṣẹ́ akanṣe Sentry yín, kí ẹ sì yí sí ìsàlẹ̀ sí ẹ̀ka Tag . Ẹ ó rí tag tí a pè ní mouseplayer_session_url. Ẹ tún lè ṣe àlẹ̀mọ́ ọ̀ràn Sentry pẹ̀lú pápá ìwádìí query: mouseplayer_session_url:*.

Táàbù metadata Bugsnag

Nínú ìròyìn àṣìṣe Bugsnag yín, ẹ ṣàyẹ̀wò táàbù ìrìn kiri ìsàlẹ̀. Táàbù tuntun tiyín tí a pè ní MousePlayer yóò hàn, pẹ̀lú ìjápọ̀ tó ṣeé tẹ̀ session_url .

Irinṣẹ́ ìṣàwárí àṣìṣe Datadog RUM

Nínú Datadog RUM, ẹ lọ sí ìgbà ìlò àṣìṣe èyíkéyìí tí a gbàsílẹ̀, kí ẹ sì ṣàyẹ̀wò igi JSON Àyíká gbòòrò / Attribute . A fi URL sílẹ̀ lábẹ́ @mouseplayer_session_url.

Àwọn àmì ìṣòwò tí a dárúkọ níbí jẹ́ ti àwọn olówó wọn. MousePlayer kò ní ìbáṣepọ̀ òwò pẹ̀lú àwọn olùpèsè yìí.