ich versuche gerade mit mäßigem erfolg, ein auf meinem webserver regelmäßig erneuertes bild der bienenstöcke in einem grafana-panel darzustellen (hier, ganz runterscrollen).
ich schaffe:
dass das bild dargestellt wird und in grafana aktualisiert wird, wenn ich den ganzen dashboard reloade. auch wird das aktuelle bild angezeigt, wenn ich mit rechtslick “bild in anderem tab öffnen” mache.
schön wäre:
wenn das bild sich im panel automatisch aktualisiert,
ich den aktualisierungsintervall festlegen könnte, je nachdem wie häufig die aktualisierung auf dem server stattfindet.
probiert habe ich:
das pictureit-panel. allderdings stürzt es regelmäßig ab, bevor ich irgendetwas speichern kann: “An unexpected error happened. Details: Type Error, str is undefined”.
außerdem greift das panel konsequent auf die gecachte uraltversion des bildes zurück.
das internet empfiehlt:
eine html-seite in einem grafana-html-panel aufrufen. in der html-seite das bild darstellen und die aktualisierung umsetzen, z.b. so:
leider ist das html-panel nicht im angebot hier im schwarm. sicherheitsgründe? kann ich ja immer nicht so gut einschätzen. würde mir aber intuitiv einleuchten, bei einem html-panel, das dann auch noch js zulässt…
sieht wer noch andere möglichkeiten für mein einbettungsproblem?
Dein angestrebtes <meta http-equiv="refresh" content="600"> ist problematisch, weil es die komplette Seite neu lädt, auch, wenn Du gerade im Editor Modus bist [1]. Es ist besser, nur selektiv das Bild neu zu laden, per JavaScript, wie bei Refreshing gif image - #11 by svetb - Grafana - Grafana Labs Community Forums gezeigt.
Drüben im Dashboard Labor » HTML embedding findest Du nun die HTML Vorlage für Deinen Anwendungsfall. Hier als Embed und bei [2] als HTML/JavaScript Code abgebildet.
Mit dem data-refresh Attribut lässt sich die Refresh-Rate bestimmen. Die Einheit ist “Sekunden”.
Du könntest die Implementierung vielleicht noch in Browsern verschiedener Hersteller testen? Ich habe es bislang nur im Firefox entwickelt und getestet.
Soweit nicht so problematisch, wenn nur alle 10 Minuten aktualisiert wird. Bei höheren Refresh-Raten, zum Experimentieren, wirkt es sich aber negativ aus, und ist im Entwicklungsbetrieb hinderlich. ↩︎
Bild aus anderer Quelle im Grafana anzeigen, mit Cache Busting.
<!DOCTYPE html>
<!--
https://community.hiveeyes.org/t/panel-fur-webcam-bild-das-regelmassig-aktualisiert-wird/4921
https://community.grafana.com/t/refreshing-gif-image/49507/11
-->
<html>
<head>
<title>mois' Beecam</title>
<script type="text/javascript">
/**
* Refresh image in HTML body, with cache busting.
*/
function updateImage() {
// Acquire image object from DOM.
const image = document.getElementById("image")
// Define default settings.
if (!image["data-src"]) image["data-src"] = image.src
const refresh_delay = Number.parseInt(image.attributes["data-refresh"].value) || 60
// Compute URL, with cache busting query parameter.
let cachebuster = (Math.random() * 10000000).toFixed()
const image_url = image["data-src"] + "?nocache=" + cachebuster.toString()
// Load image.
console.log(`Loading image at ${image_url}`)
image.src = image_url
// Schedule next refresh cycle.
console.log(`Scheduling refresh in ${refresh_delay} seconds`)
setTimeout(updateImage, refresh_delay * 1000);
}
// Start a bit later, after the page's body has been loaded into the DOM.
setTimeout(updateImage, 1000);
</script>
</head>
<body>
<img id="image" src="https://www.euse.de/honig/beescale/latest.jpg" data-refresh="10" />
</body>
</html>
Das allerdings ist ein Problem von netsurf selbst, und es ist ab Version 3.9 gefixt. Aber netsurf 3.10 zeigt die Seite ebenfalls nicht an, explodiert aber immerhin nicht! ,)
Sag Bescheid, wenn Du dort nicht Dein Beispiel sehen willst. Schick(t) gerne Vorschläge für eine anonymere Variante, z.B. zu irgendeinem öffentlichen Webcam Bild. Der einzige Wunsch ist, dass die URL zum Bild halt einigermaßen stabil sein sollte. Wenn dort dann auch noch “mehr passiert”, als typischerweise bei Deiner Bienenkiste, ist es vielleicht auch nicht schlecht als kanonisches Beispiel.