Hizmet Nöbet ile yazılmış ön uç uygulamalardaki hataları uzaktan izlemenize olanak tanır JavaScript.
Ön uç uygulamalardaki sorunları gidermeye çalışıyorum JavaScript Genellikle erişiminizin olmadığı kullanıcının tarayıcısından kaynaklandığı için yanıltıcı olabilir. Fakat, Nöbet Hataların uzaktan izlenmesini mümkün kılar.
Bu makalede tartışılan çözümleri indirebilirsiniz.
Ne gerekli
Bu örnekleri kullanmak istiyorsanız şunlara ihtiyacınız olacak:
- : Uygulamanın parçası olmayan, zengin özelliklere sahip bir geliştirme aracı. En son LTS sürümünü (8.12.0) indirdik
- Nöbet: Ya Sentry hizmetindeki bir Hesap (ayda 10 bine kadar hatayı ücretsiz olarak kaydedebilirsiniz) ya da kurulu bir yerel Sentry -
Sunucunuza kurulum
Sentry On-Premise'ı sunucunuza kurmak için 2 yolu takip edebilirsiniz.
-
Rpm'yi oluşturun ve yükleyin -
-
Resmi yükleyiciyi kullanın:
Установить на сервер docker и docker-compose git clone https://github.com/getsentry/onpremise.git ./install.sh
Standart Kullanım
Başlamak için hizmet web sitesinden yeni bir tane ekleyin Nöbet-uygulama için proje. İstediğiniz dili seçtikten sonra ilgili belgeleri alacaksınız. Bizim durumumuzda seçtik JavaScript.
İlk örnek standarttır JavaScript. Burada iki düğme var: "Merhaba" (Merhaba ve "Hata" (Hata).
Düğmeye tıkladıktan sonra "Merhaba", ekran yeniden başlatılacak ve bloke edilecek denemek hatayı tespit edecek ve yakalayacaktır. Hata “yakalandıktan” sonra hata raporu manuel olarak servise gönderilir. Nöbet.
“Hata” butonu bir hatayı kolayca tespit etmenizi sağlar.
vanilya/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>Notlar:
- Sentry bir CDN'den kurulur ve global bir değişken olarak kullanıma sunulur
- Biraz önce JavaScript'imizde Sentry'yi başlattık
Bu örneği test etmek için statik bir web sunucusu platformu kullanabiliriz. node.js: http sunucusu. Dosyanın saklandığı klasöre gidin index.htmlAdresi tarayıcıda açmak için aşağıdaki satırı girin (önbelleğe almayı devre dışı bırakan seçenek) .
Yakalanan hatalar nasıl görüntülenir?
İlk önce düğmeye tıklayın "Merhaba".
Bir hata yakaladık, bu nedenle çağrı yığınında açılmıyor ve bu nedenle konsolda izlenmiyor. Ancak, gönderdiğimiz için Nöbet Bir hatayı manuel olarak bildirin, hesabınızda bununla ilgili bir mesaj göreceğiz.
Notlar:
- Hangi satırın (24) hatayı içerdiğini takip edebiliriz
- Ayrıca kırıntı izi, hataya yol açan tarayıcı eylemlerini görüntüler.
Yakalanmayan hatalar nasıl görüntülenir?
Düğmeye tıklamak "Hata".
Hata çağrı yığınını kabartır ve böylece konsolda bir hata mesajı görüntülenir. Bundan sonra Sentry, herhangi bir ek eyleme gerek kalmadan hatayı otomatik olarak izler.
Notlar:
- Hatanın hangi satırda (30) kaybolduğunu görebiliriz
- Kırıntı izi yok (nedenini tam olarak anlamıyorum)
Proje güvenliği nasıl sağlanır?
Hangi sayfaların projemize hata bildirebileceğini nasıl kontrol ettiğimizi fark etmiş olabilirsiniz. Nöbet; yardımla dsn'sini kayıtları. Sorun, girişin sayfanızın kaynak kodunu görüntüleyen herkes tarafından görülebilmesidir.
Bunu önlemek için projemize hata raporu gönderebilecek alan sayısını sınırlamamız gerekiyor. Bu örnekte kullandık localhost (yerel ana bilgisayar). Bu seçenek ayarlar sekmesinde yapılandırılmıştır Nöbet-proje, Nöbetçi Proje Ayarı.
Salıverme
Nasıl kullanılacağını düşünüyorsanız Nöbet uygulamamızın farklı varyasyonlarında hataları sürüm numarasıyla işaretleyecek bir tür mekanizmaya ihtiyacımız var.
Sonuçta düzelttiğimiz hatanın tekrar ortaya çıkmasını istemiyoruz ve düzelttiğimiz şeyin işe yaramadığını düşünüyoruz. Kullanıcı uygulamanın daha eski, önbelleğe alınmış bir sürümünü başlatmış da olabilir.
Sorunu çözmek için tanımlayıcıyı girmeniz gerekir salıverme (sürümler) başlangıçta Nöbet.
vanilya/index.html
...
var RELEASE = '0.1.0';
Sentry.init({
dsn: 'https://[email protected]/1289664',
release: RELEASE,
});
...Bundan sonra tüm yeni hatalar şu şekilde işaretlenecektir: bırakma (0.1.0)yani kodun doğru sürümüne bağlanacaklar.
Notlar:
- Sürümleri kullanmanın basit bir yolunu bulduk
- Sentry daha fazlasını kullanmanıza olanak tanır ile yakından ilişkili olan GitHub. Bu işlev, belirli işlemleri gerçekleştirmeden önce hataların izlenmesini mümkün kılar.
Not: İkinci bölüm daha uzun olduğu için ayrı bir yazıda olacak.
PS Telegram sohbeti Sentry
Not: Bunun yazının çevirisi olduğunu belirtmeyi unuttum
Kaynak: habr.com