Grafana: [FEATURE-Anfrage] Bei Aktivierung des Alarms Ton abspielen

Wo ist das Problem? Fügen Sie sich einfach einen Webhook hinzu, um den Ton mit der Webhook-Warnungsfunktion abzuspielen;)

@flyersa

Hey flieg,
habe noch nie mit Webhooks gearbeitet. einen Vorschlag, wo ich anfangen soll? :)

Bitte zeigen Sie mir ein Beispiel, wenn Sie Ton gespielt haben

+1 für Out-of-the-Box-Funktionalität für Ton bei neuer Benachrichtigung im Browser

+1 das hoffe ich auch

+1

Es wird sehr hilfreich sein

Ich denke, es wird auch eine gute Funktion sein. Da ich es gerade wirklich brauche. 🤣 🤣 🤣

Wurde die Play-Sound-Funktion implementiert?

Bitte setzen Sie dies um!!!!!

+1

+1

+1

+1

Nach einigen internen Diskussionen waren wir uns einig, dass wir dies im Kern von Grafana nicht unterstützen wollen. Da Grafana jedoch Panel-Plugins unterstützt, ist es möglich, ein neues Plugin zu entwickeln, das das Warnungslisten-Panel erweitert, oder ein neues Plugin zum Abspielen von Warntönen.

Aber Sie unterstützen Alerts! Wie schwer ist es, eine .wav-Datei abzuspielen, wenn das Panel blinkt?

Ich denke, er hat den Punkt, es sollte im Panel unterstützt werden, und ich denke, das ist es, was wir gefordert haben, nicht den Grafana-Kern, sondern den der Panels. Die meisten von uns verwenden sowieso die Standard-Panels.

Wir brauchen es auch! +1

@bergquist wie wäre es mit Benachrichtigungen mit Desktop-Benachrichtigung wann?

REOPEN Funktionsanfrage. Ein neues Jahr, frische Augen. Bitte.

+1

+1

+1

+1
unbedingt erwünschte Funktion,
Vielleicht wäre eine Erweiterung der Grafana Alerting API mit der Kombination von POST Webhook ein guter Ansatz?

+1
Wenn das Grafana-Dashboard in einem Kontrollraum, NOC, SOC.... zusammen mit anderen Monitoren projiziert wird, ist es wertvoll, Töne zu haben, wenn ein Grafana-Alarm auftritt.

+1 setzt dies um. Ich betreibe Grafana auf einer Videowand, die kritische Systeme überwacht. eine Warnung, die mich dazu auffordert, zur Wand hochzuschauen, würde die Reaktionszeiten sehr erleichtern!

+1
Dies wäre eine sehr nützliche Funktion

+1 Auch unser Unternehmen hält es für eine sehr gute Entwicklung und es wird uns helfen, die Warnungen schneller zu sehen, insbesondere wenn Sie mit vielen NOC-Tools umgehen.
@bergquist - jede Chance, dieses wieder zu öffnen, wenn immer mehr Leute danach fragen.
Ich denke, es ist nicht sehr schwer, es zu entwickeln, wenn Sie den Schwellenwert (Min ODER Max) einstellen und ihn überschreiten, dann wird der Alarm ausgelöst.
Auf der Suche nach Ihrer Antwort.
Tnx
Dompteur

+1 ich brauche das

+1 Ich bin überrascht, dass Grafana diese Funktion nicht hat.

+1 Es ist sehr wichtig, Grafana für die Überwachung großer Bildschirme zu verwenden.

+1
Auch das brauchen wir! :)

Dies ist eine grundlegende Funktion, die wir wirklich brauchen.

+1

+1

+1

+1

Das ist sehr cool, das brauchen wir auch! :)

+1 Es kann sehr nützlich sein, IT-Systeme wie mich zu überwachen.

+1

+1 wäre toll. Grafana ist seit Jahren die Abschreckung des Managements, und ein solches Feature ist definitiv etwas, das man vorführen kann.

+1

+1 muss Funktion haben :)

+1

+1
Wenn es sehr dringend benötigt wird, können wir das dynamische JavaScript einschleusen, um bei Benachrichtigungen einen Ton abzuspielen

setInterval(Funktion() {
AlertUsers();
}, 60 * 1000);

Funktion AlertUsers() {
if ($('div').hasClass('panel-alert-state--alerting')) {
var audio = new Audio('http://soundbible.com/grab.php?id=2142&type=mp3');
audio.play();
}
}

Hallo allerseits,
im Grunde von vini @Thx an ihn :D, ich schreibe eine kleine Alert-Aktivierung, die du in deinem Browser

Normale Warnregeln lösen eine Warntondatei aus + Statusfelder werden alarmieren.

Änderungen:

grafana/public/views/index.html

<div class="main-view"> <- ADD AFTER THIS LINE

   <ul>

    <li><button style="background-color:#f44336;float:left;margin-left:5%;margin-right:5px;color:white;" onmousedown="clearInterval(stopalertt);stopalertt=false;">ALERT OFF</button>

    <button style="background-color:#4CAF50;color:white;" onmousedown="stopalertt=setInterval(AlertUsers, 5000);">ALERT ON</button></li>

    </ul>

Am Ende der Datei (index.html) vor dem /body- und /html-Tag schließen (nach dem Schließen des script-Tags)
füge das ein:

Wenn Sie möchten, können Sie dies in eine externe js-Datei einfügen.

Gott, das ist das schlimmste "WYSIWYG", das ich je gesehen habe. Verzeihung :-/

Grüße,
7

Hallo allerseits,
im Grunde von vini @thx an ihn :D, ich schreibe eine kleine Alert-Aktivierung, die du in deinem Browser

Normale Warnregeln lösen eine Warntondatei aus + Statusfelder werden alarmieren.

Änderungen:

grafana/public/views/index.html

<div class="main-view"> <- ADD AFTER THIS LINE

   <ul>

    <li><button style="background-color:#f44336;float:left;margin-left:5%;margin-right:5px;color:white;" onmousedown="clearInterval(stopalertt);stopalertt=false;">ALERT OFF</button>

    <button style="background-color:#4CAF50;color:white;" onmousedown="stopalertt=setInterval(AlertUsers, 5000);">ALERT ON</button></li>

    </ul>

Am Ende der Datei (index.html) vor dem /body- und /html-Tag schließen (nach dem Schließen des script-Tags)
füge das ein:

Wenn Sie möchten, können Sie dies in eine externe js-Datei einfügen.

Gott, das ist das schlimmste "WYSIWYG", das ich je gesehen habe. Verzeihung :-/

Grüße,
7

@7lives83 Sieht gut aus

Wie wäre es mit dieser Möglichkeit?

@viniston :
Viel besser :-)

Vielleicht möchten Sie den Button-Code posten und wo er hinzufügen?

Dankeschön,
Grüße,
Max

Wir können unseren Ton für die Benachrichtigung auswählen

unten hinzufügen *li im Fußzeileninhalt*

         <li>

             <a href="javascript:void(0);" class="dropdown-alert-on">
               <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="alertOn()">
                  <i  class="fa fa-bell"></i>
                    Alert On
                </a>
              <div id="alertOnDropdown" class="dropdown-content-alert-on">
                <a href="javascript:void(0);" onclick="selectedSound=1;stopalert=setInterval(AlertUsers, 5000);">Analog Watch Alarm</a>
                <a href="javascript:void(0);" onclick="selectedSound=2;stopalert=setInterval(AlertUsers, 5000);">Busy Signal</a>
                <a href="javascript:void(0);" onclick="selectedSound=3;stopalert=setInterval(AlertUsers, 5000);">FogHorn Barge</a>
                <a href="javascript:void(0);" onclick="selectedSound=4;stopalert=setInterval(AlertUsers, 5000);">Metal Metronome</a>
                <a href="javascript:void(0);" onclick="selectedSound=5;stopalert=setInterval(AlertUsers, 5000);">Metronome</a>
                <a href="javascript:void(0);" onclick="selectedSound=6;stopalert=setInterval(AlertUsers, 5000);">Teeth Chatter</a>
                <a href="javascript:void(0);" onclick="selectedSound=7;stopalert=setInterval(AlertUsers, 5000);">Turkey Putt</a>
                <a href="javascript:void(0);" onclick="selectedSound=8;stopalert=setInterval(AlertUsers, 5000);">Store Door Chime</a>
              </div>
            </a>
          </li>
          <li>
            <a href="javascript:void(0);" class="sidemenu-item dropdown dropup" onclick="clearInterval(stopalert);stopalert=false;console.log('Interval stopped', stopalert);" >
              <i class="fa fa-bell-o"></i>
              Alert Off
            </a>
          </li>

funktioniert :) schöne Stilarbeit! danke @viniston

funktioniert :) schöne Stilarbeit! danke @viniston
Danke auch @7lives83

ein Vorschlag:

wenn du das änderst:

Du hast ein Pull-Up-Menü :-) aber das ist nur ein ganz kleiner Styling-Tipp. mehr nicht :) tolle arbeit vini :)

ein Vorschlag:

wenn du das änderst:

Du hast ein Pull-Up-Menü :-) aber das ist nur ein ganz kleiner Styling-Tipp. mehr nicht :) tolle arbeit vini :)

Cooles Zeug Max :)

Und das letzte Feature:

füge an dieser Stelle hinzu:

<a href="javascript:void(0);" id="alertonbtn" class="sidemenu-item dropdown dropup alertondropbtn" onclick="alertOn()">
<i  class="fa fa-bell"></i>
Alert On
</a>

id="alertonbtn"

füge an dieser Stelle hinzu:

<a href="javascript:void(0);" id="alertoffbtn" class="sidemenu-item dropdown dropup" onclick="clearInterval(stopalert);stopalert=false;console.log('Interval stopped', stopalert);" >
<i class="fa fa-bell-o"></i>
Alert Off
</a>

id="alertoffbtn"

in dem

Früher hatte ich unten Feature implementiert. Das soll den aktuellen Status hervorheben

sieht gut aus :)

Hallo Leute,
ich habe unsere funktion ein wenig umgestaltet, damit du sie ganz einfach zu deinem grafana hinzufügen kannst. Ein neues Feature ist, dass wir jetzt Cookies setzen, um Ihre letzte Auswahl zu speichern (Alarm an aus).

Hinweis: Cookies müssen in Ihrem Browser aktiviert sein!!

Komplettes Gebäude:

• Alle Änderungen werden in der Datei /public/view/index.html vorgenommen:

1. Ersetzen Sie den Fußzeilenabschnitt durch diesen:

<footer class="footer">
          <div class="text-center">
            <ul>
                <li>

                         <a href="javascript:void(0);" class="dropdown-alert-on">
                           <a href="javascript:void(0);" id="alertonbtn" class="sidemenu-item dropdown dropup alertondropbtn" onclick='document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; document.cookie = "alarm=on;path=/";alertOn();checkifonoff();'>
                                  <i class="fa fa-bell"></i>
                                        Alert On
                                </a>
                          <div id="alertOnDropdown" class="dropdown-content-alert-on">
                                <a href="javascript:void(0);" onclick="selectedSound=1;">Standart (BIEP)</a>
                                <a href="javascript:void(0);" onclick="selectedSound=2;">Busy Signal</a>
                                <a href="javascript:void(0);" onclick="selectedSound=3;">FogHorn Barge</a>
                                <a href="javascript:void(0);" onclick="selectedSound=4;">Metal Metronome</a>
                                <a href="javascript:void(0);" onclick="selectedSound=5;">Metronome</a>
                                <a href="javascript:void(0);" onclick="selectedSound=6;">Teeth Chatter</a>
                                <a href="javascript:void(0);" onclick="selectedSound=7;">Turkey Putt</a>
                                <a href="javascript:void(0);" onclick="selectedSound=8;">Store Door Chime</a>
                          </div>
                        </a>
          </li>
                  <li>
             <a href="javascript:void(0);" id="alertoffbtn" class="sidemenu-item dropdown dropup" onclick='document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";document.cookie = "alarm=off;path=/";checkifonoff();' >
              <i class="fa fa-bell-o"></i>
              Alert Off
            </a>
          </li>
                [[if .NewGrafanaVersionExists]]
                    <li>
                <a href="https://grafana.com/get" target="_blank" bs-tooltip="'[[.NewGrafanaVersion]]'">
                  New version available!
                </a>
              </li>
                [[end]]
                          </ul>
          </div>
        </footer>

1. Fügen Sie vor dem </body> Tag Folgendes hinzu:

<script>
var checkcookie = document.cookie;
console.log("Cookie-Check Inital:", checkcookie);
if (checkcookie === "") {
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=on;path=/";
console.log("Cookie-Check-First-Set:", checkcookie);
}

var checkoffon = setInterval(checkifonoff,6000);
var selectedSound = 1; var sounds = { '1': 'https://www.soundjay.com/button/beep-04.mp3', '2': 'http://soundbible.com/grab.php?id=1072&type=mp3', '3': 'http://soundbible.com/grab.php?id=2142&type=mp3', '4': 'http://soundbible.com/grab.php?id=915&type=mp3', '5': 'http://soundbible.com/grab.php?id=914&type=mp3', '6': 'http://soundbible.com/grab.php?id=1344&type=mp3', '7': 'http://soundbible.com/grab.php?id=1318&type=mp3', '8': 'http://soundbible.com/grab.php?id=1599&type=mp3', };

function checkifonoff() {
var checkcookie = document.cookie;

if (checkcookie === "alarm=off"){
var stopalertbtn = document.getElementById('alertoffbtn');
var startalertbtn = document.getElementById('alertonbtn');
stopalertbtn.style.color= 'green';
startalertbtn.style.color= '#8e8e8e';
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=off;path=/";
console.log("ALARM OFF", checkcookie);
}

if (checkcookie === "alarm=on") {
var startalertbtn = document.getElementById('alertonbtn');
var stopalertbtn = document.getElementById('alertoffbtn');
startalertbtn.style.color= 'green';
stopalertbtn.style.color= '#8e8e8e';
var audioPath = sounds[selectedSound]; if ($('div').hasClass('panel-alert-state--alerting')) { console.log('panel-alert-state--alerting'); var audio = new Audio(audioPath); audio.play(); } if ($('div').hasClass('panel-container st-card effect-hover error-state')) { console.log('panel-container st-card effect-hover error-state'); var audio = new Audio(audioPath); audio.play(); } if ($('div').hasClass('panel-container panel-transparent st-card effect-hover error-state')) { console.log('panel-container panel-transparent st-card effect-hover error-state'); var audio = new Audio(audioPath); audio.play(); }
document.cookie = "alarm=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "alarm=on;path=/";
console.log("ALARM ON", checkcookie);
}
}


function alertOn() {
document.getElementById("alertOnDropdown").classList.toggle("show");
}

window.onclick = function(event) {
if (!event.target.matches('.alertondropbtn')) {
var dropdowns = document.getElementsByClassName("dropdown-content-alert-on");
var i;
for (i = 0; i < dropdowns.length; i++) {
var openDropdown = dropdowns[i];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
}

</script>
<style>
        .dropdown-alert-on {
          position: relative;
          display: inline-block;
        }

        .dropdown-content-alert-on {
          display: none;
          position: absolute;
          background: #161719;
          min-width: 160px;
          overflow: auto;
          box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
          z-index: 1;
          border-bottom: 1px solid #444;
          bottom: 20px;
        }

        .dropdown-content-alert-on a {
          color: black;
          padding: 12px 16px;
          text-decoration: none;
          display: block;
                  padding: 8px 16px;
                font-size: 12px;
                color: #8e8e8e;
                margin-bottom: 4px;
                white-space: nowrap;
        }

        .dropdown-alert-on a:hover {background-color: #ddd;}

        .show {display: block;}

        .text-center {position: relative;}

        .footer {position: absolute;
                top:100%;
                padding: 0 0 0 0;}

        .is-react .footer {display: block;}
</style>

Verehrte Gäste,

schön, das hier zu sehen, ich habe eine Frage, was ist, wenn der Soundalarm auf demselben Server mit Grafana ist, muss sich jeder Code ändern?

@7lives83
Hey sehr schön.
Ist es möglich lokale mp3s zu verwenden. ich bekomme es nicht zum laufen

@Yudhistir4

Verehrte Gäste,

schön, das hier zu sehen, ich habe eine Frage, was ist, wenn der Soundalarm auf demselben Server mit Grafana ist, muss sich jeder Code ändern?

@DS95

@7lives83
Hey sehr schön.
Ist es möglich lokale mp3s zu verwenden. ich bekomme es nicht zum laufen

Hoffentlich meint Yud dasselbe?! :-)

Sicher. Sie müssen nur das Ziel der Audiodatei ändern. Kopieren Sie Ihre Sounds wie folgt in das neue Sounds-Verzeichnis in Ihrem öffentlichen Ordner:

ls-ltr:
-rw-r--r-- 1 root root 0 27. Januar 13:10 test1.mp3
-rw-r--r-- 1 root root 0 27. Januar 13:11 test2.mp3
[email protected] :/usr/share/grafana/public/sounds#

Ändern Sie nun Ihr ausgewähltes Sound-Ziel (in diesem Beispiel verwende ich als Servername yourmetricserver.localdomain.com <- Sie müssen dies in Ihren Servernamen ändern, auf dem der Grafana-Server aktiv ist):

var selectedSound = 1; var sounds = { '1': ' https://yourmetricserver.localdomain.com/public/sounds/test1.mp3 ', '2': ' https://yourmetricserver.localdomain.com/public/sounds/test2.mp3 ', '3': ' https://yourmetricserver.localdomain.com/public/sounds/test3.mp3 ', '4': ' https://yourmetricserver.localdomain.com/public/sounds/test4.mp3 ',
....... };

@7lives83
Hey sehr schön.
Ist es möglich lokale mp3s zu verwenden. ich bekomme es nicht zum laufen

Hi,

Bitte gehen Sie wie folgt vor, um den Ton von Ihrer lokalen MP3-Datei abzuspielen

var audio = new Audio('public/sounds/carHorn.mp3'); audio.play();

Es geht darum, den Speicherort der MP3-Datei zu ändern. Das ist es. Wenn Sie weitere Hilfe benötigen, sind wir bereit, Ihnen zu helfen

Beispiel:
HTML-Code:
<a href="javascript:void(0);" class="dropdown-alert-on"> <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="PlaySound()"> <i class="fa fa-bell"></i> Play Sound </a>

JAVASCRIPT:
Funktion PlaySound() {
var audio = new Audio('public/sounds/carHorn.mp3');
audio.play();
}

@7lives83
Hey sehr schön.
Ist es möglich lokale mp3s zu verwenden. ich bekomme es nicht zum laufen

Hi,

Bitte gehen Sie wie folgt vor, um den Ton von Ihrer lokalen MP3-Datei abzuspielen

var audio = new Audio('public/sounds/carHorn.mp3'); audio.play();

Es geht darum, den Speicherort der MP3-Datei zu ändern. Das ist es. Wenn Sie weitere Hilfe benötigen, sind wir bereit, Ihnen zu helfen

Beispiel:
HTML-Code:
<a href="javascript:void(0);" class="dropdown-alert-on"> <a href="javascript:void(0);" class="sidemenu-item dropdown dropup alertondropbtn" onclick="PlaySound()"> <i class="fa fa-bell"></i> Play Sound </a>

JAVASCRIPT:
Funktion PlaySound() {
var audio = new Audio('public/sounds/carHorn.mp3');
audio.play();
}

Bitte entpacken Sie den angehängten Ordner und legen Sie ihn in den öffentlichen Ordner
Sounds.zip