Service Sentry erlaabt Iech Bugs a Front-End Uwendungen op afstand ze iwwerwaachen a geschriwwe sinn Javascript.
Probéieren Probleemer a Front-End Uwendungen ze fixéieren Javascript ka komplizéiert sinn, well se aus dem Benotzer säi Browser stamen, op deen Dir dacks keen Zougang hutt. Allerdéngs, Sentry mécht et méiglech Bugs op afstand ze iwwerwaachen.
Dir kënnt d'Léisungen eroflueden, déi an dësem Artikel diskutéiert ginn.
Wat néideg ass
Wann Dir dës Beispiller benotze wëllt, braucht Dir:
- : E Feature-räich Entwécklungsinstrument dat net Deel vun der Applikatioun ass. Mir hunn déi lescht LTS Versioun erofgelueden (8.12.0)
- Sentry: Entweder e Kont am Sentry Service (Dir kënnt bis zu 10 Tausend Bugs pro Mount gratis ophuelen) oder en installéierten lokale Sentry -
Installatioun op Ärem Server
Fir Sentry On-Premise op Ärem Server z'installéieren, kënnt Dir op 2 Weeër goen
-
Bauen Rpm an installéieren se -
-
Benotzt den offiziellen Installateur:
Установить на сервер docker и docker-compose git clone https://github.com/getsentry/onpremise.git ./install.sh
Standard Benotzung
Fir unzefänken, füügt en neien vun der Service Websäit Sentry-Projet fir d'Applikatioun. Nodeems Dir déi gewënscht Sprooch gewielt hutt, kritt Dir déi entspriechend Dokumentatioun. An eisem Fall hu mir gewielt Javascript.
Dat éischt Beispill ass Standard Javascript. Hei sinn zwee Knäppercher: "Hallo" (Moien) an "Feeler" (Feeler).
Nodeems Dir op de Knäppchen klickt "Hallo", den Ecran wäert nei starten an de Block probéieren wäert de Käfer erkennen a fänken. Nodeems de Käfer "gefëscht" ass, gëtt de Feelerbericht manuell un de Service geschéckt Sentry.
De "Feeler" Knäppchen erlaabt Iech einfach e Feeler z'entdecken.
vanille/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>Notizen:
- Sentry gëtt vun engem CDN installéiert an als global Variabel ausgesat
- E bësse méi fréi hu mir Sentry an eisem JavaScript lancéiert
Fir dëst Beispill ze testen, kënne mir eng statesch Webserverplattform benotzen Node.js: http Server. Gitt an den Dossier wou d'Datei gespäichert ass index.html, a gitt (Optioun mat desaktivéiert Caching) déi folgend Linn fir d'Adress am Browser opzemaachen .
Wéi gefaange Käfere ginn ugewisen
Éischt klickt op de Knäppchen "Hallo".
Mir hunn e Feeler gefaangen, sou datt et den Uruffstack net opdaucht, an dofir net an der Konsole iwwerwaacht gëtt. Wéi och ëmmer, zënter mir schécken un Sentry mellt e Feeler manuell, mir gesinn e Message doriwwer an Ärem Kont.
Notizen:
- Mir kënne verfollegen wéi eng Linn (24) de Käfer enthält
- Zousätzlech weist d'Broutkummer Trail d'Browseraktiounen déi zum Feeler gefouert hunn.
Wéi ongefaange Bugs ugewise ginn
Klickt op de Knäppchen "Feeler".
De Käfer sprëtzt den Uruffstack op an doduerch gëtt eng Fehlermeldung op der Konsole ugewisen. Duerno iwwerwaacht Sentry automatesch de Feeler, ouni zousätzlech Aktiounen.
Notizen:
- Mir kënne gesinn a wéi enger Linn (30) de Käfer verluer ass
- Et gëtt kee Broutkummer Trail (ech verstinn net ganz firwat)
Wéi Projet Sécherheet ze garantéieren
Dir hutt vläicht gemierkt wéi mir kontrolléieren wéi eng Säiten Feeler bei eisem Projet mellen Sentry; mat Hëllef dsn records. De Problem ass datt den Input ka vu jidderengem gesi ginn deen de Quellcode vun Ärer Säit kuckt.
Fir dëst ze vermeiden, musse mir d'Zuel vun den Domainen limitéieren déi Feelerberichter un eise Projet ofginn. An dësem Beispill hu mir benotzt localhost (lokal Host). Dës Optioun ass am Astellungstab konfiguréiert Sentry-Projet, Sentry Project Astellung.
Verëffentlechungen
Wann Dir denkt wéi Dir benotzt Sentry a verschiddene Variatiounen vun eiser Applikatioun, da brauche mir eng Aart vu Mechanismus, dee Feeler mat enger Versiounsnummer markéiert.
No allem wëlle mir net datt de Feeler dee mir fixéiert hunn erëm opdaucht, a mir mengen datt dat wat mir fixéiert hunn net geschafft hunn. Et kann och sinn datt de Benotzer eng méi al, cache Versioun vun der Applikatioun gestart huet.
Fir de Problem ze léisen, musst Dir den Identifizéierer aginn Fräisetzung (Versioune) beim Startup Sentry.
vanille/index.html
...
var RELEASE = '0.1.0';
Sentry.init({
dsn: 'https://[email protected]/1289664',
release: RELEASE,
});
...Duerno ginn all nei Feeler als markéiert Verëffentlechung (0.1.0), dat heescht, si ginn un déi richteg Versioun vum Code gebonnen.
Notizen:
- Mir hunn en einfache Wee erausfonnt fir Verëffentlechungen ze benotzen
- Sentry erlaabt Iech méi ze benotzen , déi enk Zesummenhang mat GitHub. Dës Funktioun mécht et méiglech Bugs ze verfollegen ier Dir bestëmmte Operatiounen ausféiert.
PS Den zweeten Deel ass méi laang, also gëtt et an engem separaten Post.
PS Telegram Chat Sentry
PS Ech hu vergiess ze soen datt dëst eng Iwwersetzung vum Post ass
Source: will.com