Tüm JavaScript hatalarını yakalayın ve sunucuya gönderin

Herkesin JavaScript hatalarını global olarak kullanma ve istemci tarayıcısından bir sunucuya gönderme konusunda tecrübesi olup olmadığını merak ettim.

Benim açımdan oldukça açık olduğunu düşünüyorum, istemci tarafında gerçekleşen her istisna, hata, derleme hatası, vb bilmek ve bunları rapor etmek için sunucuya göndermek istiyorum.

Ben esas head.jsolarak sunucu tarafı için MooTools ve (JS tarafı için) ve Django kullanıyorum.

Son zamanlarda Sentry'yi üretimde test ettim ve iyi çalışıyor (JS ve PHP gibi diğer diller)

1- Açık kaynak kodlu (Kendi sunucunuza kurabilirsiniz) 2- Ücretsiz planı kullanabilirsiniz (100 rapor / gün)

Veya sunucunuza kurun: github.com/getsentry

Pencereyi kontrol ederdim. Hata

Misal:

window.onerror = function(message, url, lineNumber) {  
  //save error and send to server for example.
  return true;
};  

True değerinin döndürülmesinin varsayılan işleyicinin tetiklenmesini engelleyeceğini ve false değerinin döndürülmesinin varsayılan işleyicinin çalışmasına izin vereceğini unutmayın.

Web siteniz Google Analytics kullanıyorsa, ne yaptığımı yapabilirsiniz:

window.onerror = function(message, source, lineno, colno, error) {
  if (error) message = error.stack;
  ga('send', 'event', 'window.onerror', message, navigator.userAgent);
}

Yukarıdaki kod hakkında birkaç yorum:

• Modern tarayıcılarda, tam yığın izlemesi günlüğe kaydedilir.
• Yığın izlemesini yakalamayan eski tarayıcılarda, bunun yerine hata iletisi günlüğe kaydedilir. (Deneyimlerimde çoğunlukla daha önceki iOS sürümü).
• Kullanıcının tarayıcı sürümü de günlüğe kaydedilir, böylece hangi OS / tarayıcı sürümlerinin hangi hataları attığını görebilirsiniz. Bu, hata önceliklendirmesini ve test etmeyi basitleştirir.
• Bu kod, Google Analytics'i böyle "analytics.js" ile kullanırsanız çalışır . Eğer "gtag.js" kullanıyorsanız bunun yerine, böyle , sen fonksiyonun son satırı çimdik gerekir. Ayrıntılar için buraya bakın .

Kod yerleştirildikten sonra, kullanıcılarınızın Javascript hatalarını şu şekilde görüntülersiniz:

1. Google Analytics'te Behaviorbölümü ve ardından Top Eventsraporu tıklayın.
2. Etkinlik Kategorilerinin bir listesini alacaksınız. window.onerrorListeye tıklayın .
3. Javascript yığın izleri ve hata mesajlarının bir listesini göreceksiniz. Secondary dimensionDüğmeye tıklayarak ve Event Labelgörüntülenen metin kutusuna girerek kullanıcılarınızın işletim sistemi / tarayıcı sürümleri için rapora bir sütun ekleyin .
4. Rapor aşağıdaki ekran görüntüsü gibi görünecektir.
5. İşletim sistemi / tarayıcı dizelerini daha okunabilir açıklamalara çevirmek için bunları https://developers.whatismybrowser.com/useragents/parse/

Üçüncü taraf hizmetlerini kullanmaya çalışmayın, bunun yerine kendi hizmetinizi deneyin.

Hata İşleyicileri aşağıdaki senaryoları yakalayabilir,

1. Yakalanmayan TypeError yakalanamıyor
2. Yakalanmayan ReferenceError yakalanamıyor örneğin: var.click ()
3. TypeError yakalanabilir
4. Sözdizimi hatası yakalanabilir
5. ReferenceError yakalanabilir

Javascript Hataları Yakalamak için:

window.addEventListener('error', function (e) {
  //It Will handle JS errors 
})

AngularJS Hataları Yakalamak için:

app.config(function ($provide) {
$provide.decorator('$exceptionHandler', function ($delegate) {
   return function (exception, cause) {
       //It will handle AngualarJS errors
      }
   })
})

Ayrıca, http://jslogger.com hizmeti bu konuda yardımcı olabilir:

Javascript hatalarını ve buluttaki olayları günlüğe kaydetme

dan http://jslogger.com/features :

Artık sitenizin kullanıcı deneyimini bozan tüm hataları gözetleyebilirsiniz. Her Javascript hatası yakalanacak ve daha sonra hata ayıklama için size getirilecektir.

YASAL UYARI: hizmete / şirkete bağlı değildir.

Atatus'u deneyebilirsiniz - Modern web uygulamaları için Gerçek Kullanıcı İzleme (RUM) ile birlikte yeni bir JavaScript Hata İzleme Hizmeti.

Sadece hataları değil, aynı zamanda hatayı tetikleyen kullanıcı olaylarını da yakalarız. Bu, hatanın sonunda yeniden oluşturma adımları verir.

Hata yakalamanın yanı sıra, sayfa yükleme süresini de yakalar ve farklı perspektiflerde gösteririz - Coğrafi, Tarayıcı, Sayfa Detaylandırma, Sayfa Histogramı, Ajax İzleme ve İşlem İzleme.

https://www.atatus.com/

Mevcut dokümanlar: https://www.atatus.com/docs

Feragatname: Atatus'ta bir web geliştiricisiyim.

Yakalanmamış kütüphane işlenmeyen ret dahil olmak üzere iyi serbest yolu yakalama tüm JS hatalar vardır.

Http://rescuejs.com/ adresindeki bu yeni hizmete göz atmak isteyebilirsiniz . https://bugsnag.com/

Sunucu tarafı kodu kendiniz yazmadan tüm javascript hatalarınızı günlüğe kaydetmenizi sağlar. Ayrıca tarayıcı sürümlerini de izler.

Ben onları% 100 "kurumsal hazır" düşünün emin değilim, ama kesinlikle kontrol değer.