Perkhidmatan Sentry membolehkan anda memantau pepijat dari jauh dalam aplikasi bahagian hadapan yang ditulis dalam JavaScript.
Cuba untuk menyelesaikan masalah dalam aplikasi bahagian hadapan dihidupkan JavaScript boleh menjadi rumit kerana ia berasal dari penyemak imbas pengguna, yang anda sering tidak mempunyai akses kepadanya. Walau bagaimanapun, Sentry memungkinkan untuk memantau pepijat dari jauh.
Anda boleh memuat turun penyelesaian yang dibincangkan dalam artikel ini.
Apa yang perlu
Jika anda ingin menggunakan contoh ini, anda memerlukan:
- : Alat pembangunan kaya ciri yang bukan sebahagian daripada aplikasi. Kami memuat turun versi LTS terkini (8.12.0)
- Sentry: Sama ada Akaun dalam perkhidmatan Sentry (anda boleh merekod sehingga 10 ribu pepijat setiap bulan secara percuma) atau Sentry tempatan yang dipasang -
Pemasangan pada pelayan anda
Untuk memasang Sentry On-Premise pada pelayan anda, anda boleh menggunakan 2 cara
-
Bina rpm dan pasangkannya -
-
Gunakan pemasang rasmi:
Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ docker ΠΈ docker-compose git clone https://github.com/getsentry/onpremise.git ./install.sh
Penggunaan Standard
Untuk bermula, tambahkan yang baharu daripada tapak web perkhidmatan Sentry-projek untuk permohonan itu. Selepas memilih bahasa yang dikehendaki, anda akan menerima dokumentasi yang sepadan. Dalam kes kami, kami memilih JavaScript.
Contoh pertama adalah standard JavaScript. Terdapat dua butang di sini: "Helo" (Hello) dan "Ralat" (Ralat).
Selepas anda klik butang "Helo", skrin akan but semula dan blok cubalah akan mengesan dan menangkap pepijat. Selepas pepijat "ditangkap", laporan ralat dihantar secara manual kepada perkhidmatan Sentry.
Butang "Ralat" membolehkan anda mengesan pepijat dengan mudah.
vanila/index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Vanilla</title>
</head>
<body>
<button id="hello">Hello</button>
<button id="error">Error</button>
<div id="output"></div>
<script src="https://browser.sentry-cdn.com/4.0.5/bundle.min.js" crossorigin="anonymous"></script>
<script>
(function () {
'use strict';
Sentry.init({ dsn: 'https://[email protected]/1289664' });
var helloEl = document.getElementById('hello');
var errorEl = document.getElementById('error');
var outputEl = document.getElementById('output');
helloEl.addEventListener('click', handleHelloClick);
errorEl.addEventListener('click', handleErrorClick);
function handleHelloClick() {
outputEl.innerHTML = 'Hello World';
try {
throw new Error('Caught');
} catch (err) {
Sentry.captureException(err);
}
}
function handleErrorClick() {
throw new Error('Uncaught');
}
})();
</script>
</body>
</html>Nota:
- Sentry dipasang dari CDN dan didedahkan sebagai pembolehubah global
- Π§ΡΡΡ ΡΠ°Π½ΡΡΠ΅ ΠΌΡ Π·Π°ΠΏΡΡΡΠΈΠ»ΠΈ Sentry Π² Π½Π°ΡΠ΅ΠΌ JavaScript-Π΅
Untuk menguji contoh ini, kita boleh menggunakan platform pelayan web statik Node.js: pelayan http. Pergi ke folder tempat fail disimpan index.html, dan masukkan (pilihan dengan melumpuhkan caching) baris berikut untuk membuka alamat dalam penyemak imbas .
Cara pepijat yang ditangkap dipaparkan
Mula-mula klik butang "Helo".
Kami menangkap pepijat, jadi ia tidak akan muncul dalam timbunan panggilan, dan oleh itu tidak dipantau dalam konsol. Namun, sejak kami hantar ke Sentry melaporkan pepijat secara manual, kami akan melihat mesej mengenainya dalam akaun anda.
Nota:
- Kita boleh mengesan baris mana (24) yang mengandungi pepijat
- Selain itu, jejak serbuk roti memaparkan tindakan penyemak imbas yang membawa kepada ralat.
Bagaimana pepijat yang tidak ditangkap dipaparkan
Klik butang "Ralat".
Pepijat menggelembungkan timbunan panggilan dan dengan itu mesej ralat dipaparkan pada konsol. Selepas ini, Sentry memantau pepijat secara automatik, tanpa sebarang tindakan tambahan.
Nota:
- Kita boleh lihat di baris mana (30) pepijat hilang
- Tiada jejak serbuk roti (saya tidak begitu faham mengapa)
Bagaimana untuk memastikan keselamatan projek
Anda mungkin perasan cara kami mengawal halaman yang boleh melaporkan ralat kepada projek kami Sentry; dengan bantuan dsn rekod. Masalahnya ialah input boleh dilihat oleh sesiapa sahaja yang melihat kod sumber halaman anda.
Untuk mengelakkan ini, kami perlu mengehadkan bilangan domain yang boleh menyerahkan laporan ralat kepada projek kami. Dalam contoh ini kami gunakan localhost (host tempatan). Pilihan ini dikonfigurasikan dalam tab tetapan Sentry-projek, Tetapan Projek Sentry.
Keluaran
Jika anda berfikir tentang cara menggunakannya Sentry dalam variasi aplikasi kami yang berbeza, maka kami memerlukan beberapa jenis mekanisme yang akan menandakan ralat dengan nombor versi.
Lagipun, kami tidak mahu pepijat yang kami betulkan muncul semula, dan kami berpendapat bahawa apa yang kami betulkan tidak berfungsi. Mungkin juga pengguna telah melancarkan versi lama aplikasi yang dicache.
Untuk menyelesaikan masalah, anda perlu memasukkan pengecam pelepasan (versi) pada permulaan Sentry.
vanila/index.html
...
var RELEASE = '0.1.0';
Sentry.init({
dsn: 'https://[email protected]/1289664',
release: RELEASE,
});
...Selepas ini, semua ralat baharu akan ditandakan sebagai keluaran (0.1.0), iaitu, mereka akan terikat pada versi kod yang betul.
Nota:
- Kami telah mengetahui cara mudah untuk menggunakan keluaran
- Sentry membolehkan anda menggunakan lebih banyak , yang berkait rapat dengan GitHub. Fungsi ini memungkinkan untuk mengesan pepijat sebelum melakukan operasi tertentu.
PS Bahagian kedua lebih panjang, jadi ia akan berada dalam jawatan berasingan.
Sembang PS Telegram Sentry
PS Saya terlupa untuk menunjukkan bahawa ini adalah terjemahan siaran
Sumber: www.habr.com