Klaus1: Image tag zeigt plötzlich das Bild nicht mehr

Hallo,

eine uralte Seite (um das Bild einer alten Kamera am Eingang anzuzeigen) funktioniert plötzlich nicht mehr. Das Image wird als Broken Link angezeigt. Wenn ich aber die Grafikadresse kopiere und direkt im Tab einfüge, wird das Bild problemlos angezeigt. Ich habe es auf mehreren Rechnern und auch mit mehreren Browsern (Firefox, Chrome, Maxthon) getestet. Die Seite ist wirklich sehr sehr einfach:


<BODY>
<table border="0" align="center"><tr><td align="center">
<IMG SRC="http://10.10.14.7/mjpg/video.mjpg" WIDTH="864" border="1">

</td></tr></table>
</BODY>

Kennt jemand das Problem und weiß, wie ich das beheben kann?

  1. Hallo,

    Versuch mal https statt http.

    Gruß
    Jürgen

    1. Hallo Jürgen,

      ob https oder http macht leider keinen Unterschied. Das Ergebnis bleibt leider gleich.

      Ich verstehe nicht, warum es einen Unterschied macht, ob URL direkt aufgerufen wird oder im Img-Tag angegeben wird.

      Könnte irgendeine "neue" Sicherheitseinstellung der Browser die Verwendung von externen Quellen im Img-Tag verhindern?

      1. Hallo Klaus1,

        wie rufst Du die HTML Seite auf? Auch von http://10.10.14.7? Wenn nicht, können die CORS Content Security Policy Regeln den Zugriff auf das Bild verhindern, das hängt vom Content-Security-Policy Header ab, den der Webserver schickt bzw. was der Browser per Default setzt. In den letzten Jahren wurde hier einiges verschärft.

        Welchen Browser verwendest Du? Wird irgendein CSP Header gesetzt?

        Es kann auch helfen, die Entwicklerwerkzeuge des Browsers zu öffnen und dort zu schauen, welche Fehlermeldung in der Konsole ausgegeben wird oder welcher Fehlergrund im Netzwerkprotokoll steht.

        Rolf

        --
        sumpsi - posui - obstruxi
        1. Hallo Klaus1,

          wie rufst Du die HTML Seite auf? Auch von http://10.10.14.7?

          Wie meinst Du das? Den Quellcode hatte ich ja gepostet: <IMG SRC="http://10.10.14.7/mjpg/video.mjpg" WIDTH="864" border="1">

          Und wenn ich die URL http://10.10.14.7/mjpg/video.mjpg direkt im Tab eines Browsers eingebe, funktioniert es.

          Wenn nicht, können die CORS Content Security Policy Regeln den Zugriff auf das Bild verhindern, das hängt vom Content-Security-Policy Header ab, den der Webserver schickt bzw. was der Browser per Default setzt. In den letzten Jahren wurde hier einiges verschärft.

          Welchen Browser verwendest Du? Wird irgendein CSP Header gesetzt?

          Ich habe es mit diversen Browsern versucht (Firefox, Chrome, Edge, Maxthon) Ein glaube nicht, dass irgendein CSP Header vom Server aus gesetzt wird (dafür ist die Kamera viel zu alt) Die Webseite mit dem Img-Tag verwendet keine Meta-Tags.

          Es kann auch helfen, die Entwicklerwerkzeuge des Browsers zu öffnen und dort zu schauen, welche Fehlermeldung in der Konsole ausgegeben wird oder welcher Fehlergrund im Netzwerkprotokoll steht.

          In der Konsole wird kein Fehler angezeigt. Allerdings eine Warnung: Mixed Content: Upgrade der unsicheren Anzeige-Anfrage 'http://10.10.14.7/mjpg/video.mjpg' zur Verwendung von 'https'

          Wenn ich das richtig verstehe, ändert der Browser automatisch von http auf https. Obwohl dies bei lokalen Adressen eigentlich nicht passieren sollte. Aber da der Kamera-Server zu alt ist und kein https versteht, gibt es einen Broken Link. Wenn ich die Adresse direkt im Tab eingebe, wird nicht automatisch in https geändert.

          Kann ich das Feature im Firefox einfach mal testweise abschalten? about:config und einen Parameter auf true/false?

          1. Ich habs gefunden:

            Für den Firefox:

            about:config

            security.mixed_content.block_active_content security.mixed_content.upgrade_display_content security.mixed_content.upgrade_display_content.image

            Das reicht mir, da das Bild der Kamera auf einem einzelnen Überwachungsschirm läüft.

            Vielen Dank.

            1. In der Konsole wird kein Fehler angezeigt. Allerdings eine Warnung: Mixed Content: Upgrade der unsicheren Anzeige-Anfrage 'http://10.10.14.7/mjpg/video.mjpg' zur Verwendung von 'https'

              Ich habs gefunden:

              Für den Firefox:

              about:config

              Das reicht mir, da das Bild der Kamera auf einem einzelnen Überwachungsschirm läüft.

              BEWARE!

              Diese Sicherheitseinstellung abzuschalten gefährdet das gesamte System. Auf den Monitor oder den „Überwachungsschirm“ kommt es nicht an.

              Also rufe Webseite (deren Code Du gezeigt hast) und das Image bestenfalls via „https://...“ oder (nur notfalls) via „http://...“ auf.

              Lösungen:

              • Proxy auf dem Webserver für die Cam. Für den Apache sieht das ETWA so aus:
              #http://10.10.14.7/mjpg/video.mjpg
              ProxyPreserveHost On
              ProxyPass        /cam1.mjpg http://10.10.14.7/mjpg/video.mjpg
              ProxyPassReverse /cam1.mjpg http://10.10.14.7/mjpg/video.mjpg
              RequestHeader set X-Forwarded-Proto "https" 
              

              Dazu ist das Laden von mod_proxy und mod_proxy_http erforderlich.

              Aufruf des Cam-Bildes dann mit `https://deinServer/cam1.mjpg:

              <BODY>
              <IMG SRC="/cam1.mjpg" style="width:864px; border: 1px solid red;">
              </BODY>
              

              Dein HTML mit dem seit zwei Jahrzehnten verworfenem Tabellenlayout ist „sowas von 1998“ ... da hatte England eine Königin, die sogar selbst noch das Schwert gegen Elton John führte.

              • Abholen und Weitersenden des Images via PHP oder ähnlichem auf dem Webserver

              Achtunddreißigst„beste“ Lösung

              • spezielles Browserprofil für die Cam (aber nur, wenn über dieses dann keine anderen Websites abrufbar sind - z.B. wenn die für Seiten aus dem Web ein Proxy notwendig ist, darf dieser dann in diesem Profil nicht aktiviert sein.)

              Grundfrage:

              • Im Hinblick auf die gezeigte HTML-Seite stellt sich die Frage, warum denn bitte überhaupt eine Webseite notwendig sein soll. Bilder vergrößert darstellen kann der Browser auch ohne das Geraffel.
              1. @@Raketenwilli

                Dein HTML mit dem seit zwei Jahrzehnten verworfenem Tabellenlayout ist „sowas von 1998“ ... da hatte England eine Königin

                Das ist nun kein Markenzeichen für „steinalt“. Noch 2022 hatte England eine Königin – immer noch dieselbe wie 1998. Und wie schon 1952.

                die sogar selbst noch das Schwert gegen Elton John führte.

                Auch noch gegen Lewis Hamilton (2020).

                Kwakoni Yiquan

                --
                Ad astra per aspera
                1. die sogar selbst noch das Schwert gegen Elton John führte.

                  (Link zu Beweisfoto ergänzt)

                  Auch noch gegen Lewis Hamilton (2020).

                  Der Computer sagt „Nein“.

                  Nicht 2020 und zu dem führte die Queen das Schwert nicht selbst gegen ihn. Das erledigte ein bzw. deren angeheirateter Prinz - der freilich nicht in dem Alter war, in dem Kinder einen solchen erwarten würden.

                  Du weißt doch, das ich Ehrenbürger aller Genauheims (Groß-, Klein-, Ober-, Unter-, Mittel- und deren Gemeindeverband Ganzgenauheim) bin.

          2. Hallo Klaus1,

            Den Quellcode hatte ich ja gepostet:

            Ja, aber CSP Header können auch vom Server kommen, ohne im Quellcode sichtbar zu sein.

            Mixed Content: Upgrade der unsicheren Anzeige-Anfrage 'http://10.10.14.7/mjpg/video.mjpg' zur Verwendung von 'https'

            Ja, das ist der zweite Aspekt. Ich dachte allerdings, dass die Browser mixed content einfach zurückweisen würden. Dass sie auf einer https-Seite den Zugriff auf eine http-Ressource automatisch auf https "upgraden", war mir neu.

            Security-Flags des Browsers zu verändern ist allerdings eine kritische Kiste, diese Security-Maßnahmen haben ihren Sinn und sollen verhindern, dass auf einer sicheren Seite unsicherer Inhalt angeboten wird.

            Alternativvorschlag: Wenn deine HTML Seite von einem Server kommt, der https fährt, könntest Du dort auch einen Proxy laufen lassen, der die http-Ressource auf dem Server abruft und dann per HTTPS bereitstellt. Das wäre ein Dreizeiler in PHP - sofern das im Rahmen deiner Möglichkeiten liegt.

            Rolf

            --
            sumpsi - posui - obstruxi