BBB Monitor - neu und in Farbe

Ich hatte heute zu viel Zeit und hab mich über die bestehende bbb-monitoring Lösung geärgert, weil weder das eine noch das andere die Infos hat, die ich manchmal gerne hätte. Wie schon in anderen Beiträgen erwähnt, machen die Fehler 1007 und 1020 die Runde. Ist dann doch schön zu sehen, wer von den Nutzern tatsächlich Ton und Bild hat.

Ich habe dazu eine statische Seite geschrieben, die die BBB-Api anfragt und alle Informationen hübsch darstellt:
Räume mit Name und allen Nutzern, dazu wer mit Ton/Bild/Video unterwegs ist.

Da die statische Seite keinen eigenen Server nutzt, habt ihr zwei Möglichkeiten euren BBB-Server abzufragen, entweder die Cors-Header aktivieren oder eine Cors-Erweiterung installieren, die freundlicherweise euren Browser die Daten ohne die passenden Header abfragen lässt.

Link zum Monitor (Server und Secret bereithalten): https://bbb-monitor.netlify.app/

Die bisherigen Monitoring-Lösungen: https://docs.bigbluebutton.org/admin/monitoring.html
und https://github.com/greenstatic/bigbluebutton-exporter

CORS auf dem Server zuschalten:

Auf dem BBB Server die /etc/bigbluebutton/nginx/web.nginx anpassen und folgende Location hinzufügen:

location /bigbluebutton/api/getMeetings {
  proxy_pass         http://127.0.0.1:8090;
  proxy_redirect     default;
  proxy_set_header   X-Forwarded-For   $proxy_add_x_forwarded_for;

  add_header Access-Control-Allow-Origin *;
  add_header Access-Control-Allow-Methods "GET,OPTIONS";
  add_header Access-Control-Allow-Headers  Content-Type;
  add_header Access-Control-Max-Age        86400;
}

Dann den Server neu starten: sudo /etc/init.d/nginx restart

Und hier das Repo für die Seite selbst: https://github.com/hmt/bbb-static-monitor

Ein obligatorischer Screenshot; Raum mit Breakout-Räumen

Hast du mal ein Scrrenshot?

Morgen wieder, ist grad tote Hose auf unserem BBB.

Ich hab vergessen zu erwähnen, dass auch die Breakout-Räume als Unterräume angezeigt werden. Screenshot folgt :slight_smile:

Ich hatte mir die xml aus der api immer als flat atable anzeigen lassen, ging gaz gut mit dem tool hier: https://www.luxonsoftware.com/xmlviewer

Leider ist seit zwei Monatn der Dienst nicht mehr verfügbar…

Das finde ich richtig spannend, danke auch fürs Teilen.
Allerdings sorry, dass ich vermutlich ganz dumm frage: Auf der Seite sehe ich zwei Felder, in die ich links die URL eintrage und rechts das Secret. Und dann…?
Viele Grüße
Harald
PS. Cors habe ich der github-Seite folgend hoffentlich richtig aktiviert…

Wenn Du alles richtig gemacht hast, sollte eigentlich die Raumanzeige kommen. Mach vielleicht mal die Developer Tools auf. Wenn Fehler kommen, passt was nicht.

Langweiliger Screenshot:

Ja, ich bekomme die Meldung, dass die Seite nicht erreichbar ist… Vielleicht habe ich diesen Cors-Eintrag falsch gemacht… ich habe einfach das hier vor die letzten beiden Klammern in die Datei kopiert und dann den Server durchgestartet:

# add this block!
if ($http_origin) {
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods "GET,POST,OPTIONS";
    add_header Access-Control-Allow-Headers  Content-Type;
    add_header Access-Control-Max-Age        86400;
}

Vielen Dank für deine Antwort!

Ach ja, ich muss das ergänzen, ich habs auch anders gemacht:

location /bigbluebutton/api/getMeetings {
  proxy_pass         http://127.0.0.1:8090;
  proxy_redirect     default;
  proxy_set_header   X-Forwarded-For   $proxy_add_x_forwarded_for;

  add_header Access-Control-Allow-Origin *;
  add_header Access-Control-Allow-Methods "GET,OPTIONS";
  add_header Access-Control-Allow-Headers  Content-Type;
  add_header Access-Control-Max-Age        86400;
}

Diesen Block habe ich zusätzlich unter die anderen Locations gesetzt. So wie es in der Anleitung war, hat es bei mir auch nicht funktioniert. Ich werde das oben ergänzen

Vielen Dank für die Antwort, leider bekomme ich über die Web-Konsole die Ausgabe
Server nicht erreichbar: Fehler beim Laden der Seite
Irgendwas mache ich falsch…

Die volle Adresse des Servers angegeben? https://bbb.mein-server.de Das https:// muss mit dazu.
Evtl einmal neu laden mit F5

Jetzt bekomme ich eine andere Fehlermeldung:
Uncaught (in promise) TypeError: t[2].response.meetings.meeting.filter is not a function
me App.svelte:69
p App.svelte:62
P index.mjs:764
$ index.mjs:732
Ich will dich aber echt nicht nerven damit…

Ich kann’s auch erst morgen wieder testen, sonst bekomme ich noch Ärger mit meiner Frau :wink:

Aber eins muss ich unbedingt noch sagen: das ist das netteste und hilfsbereiteste Forum, das ich kenne, danke!

Hallo,
Habe den Code eingefügt und nginx neu gestartet, dann auf der Seite URL+Secret-Key eingeben, aber es passiert nichts.
Was mache ich falsch?

VG Andre

Was sagt die Konsole, @liv_uo?
@Harald sind denn Räume offen? Der Fehler dürfte bei fehlenden Räumen auftauchen, ich muss das berücksichtigen und werde das korrigieren.

Was meinst Du mit Konsole, brauch bisschen Hilfe.?

z.B im FireFox F12 drücken, dann gehen die Entwickler-Tools auf. Dort in der konsole gibt es dann auch Fehlermeldungen

Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf https://blblabla/bigbluebutton//bigbluebutton/api/getMeetings?checksum=35c096cxxxxxxxxxxxxxxxxxxyyyyyyyyyyyyyyyyyyyzzzzzzzzzzb57bc05. (Grund: CORS-Kopfzeile ‚Access-Control-Allow-Origin‘ fehlt).

ok, dann entweder auf dem Server cors-Header setzen wie oben beschrieben oder die Cors Everywhere Erweiterung verwenden. ansonsten lässt uns der Browser diese Abfrage nicht machen

Wie verwende ich die Cors-ewrweiterung? Installiert habe ich sie.
Das ist alles Neuland für mich.
Danke!

Ok, dann noch aktivieren. Wird der rote/grüne cors-Button bei Dir angezeigt? Ansonsten muss man den durch Rechtsklick in der Buttonleiste erstmal in die Leiste holen