Mobirise-Tutorials.com

Forum für Mobirise und NOF
https://www.mobirise-tutorials.com/Forum/

Bild wird nur in Vorschau angezeigt, nicht im Netz

https://www.mobirise-tutorials.com/Forum/viewtopic.php?t=698

Seite 1 von 1

Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 00:01
von danielodanio
Hallo zusammen. Ich habe versucht, ein auf bplaced.net gespeichertes Bild in meine Seite einzubinden. Das klappt, aber eben nur in der Vorschau. Sobald ich es im Internet aufrufe, kommt ein Bild mit einem Zickzack durch. Habe ich da einen Fehler gemacht?

Ich habe dafür einen Bild-Block genommen und die URL durch meine eigene ersetzt:

Code: Alles auswählen

<section data-bs-version="5.1" class="image3" group="Images &amp; Videos" data-bg-video="{{bg.type == 'video' &amp;&amp; bg.value.url}}" mbr-class="{'mbr-fullscreen': fullScreen,
                    'mbr-parallax-background': bg.parallax}">
    <mbr-parameters>
        <header>Size</header>
        <input type="checkbox" title="Full Screen" name="fullScreen">
        <input type="checkbox" title="Full Width" name="fullWidth">
        <input type="range" inline="" title="Top" name="paddingTop" min="0" max="10" step="1" value="6" condition="fullScreen == false">
        <input type="range" inline="" title="Bottom" name="paddingBottom" min="0" max="10" step="1" value="6" condition="fullScreen == false">
        <input type="range" name="textWidth" title="Image" min="4" max="12" step="1" value="10">
        <header>Show/Hide</header>
        <input type="checkbox" title="Text" name="showText" checked="">
        <header>Background</header>
        <fieldset type="background" name="bg" parallax="">
            <input type="image" title="Image" value="../_images/background1.jpg">
            <input type="color" title="Color" value="#ffffff" selected="">
            <input type="video" title="Video" value="https://vimeo.com/428046504">
        </fieldset>
        <input type="text" title="Fallback Image" name="videoToImageOnMobile" condition="overlay &amp;&amp; bg.type === 'video'">
        <input type="checkbox" title="Overlay" name="overlay" condition="bg.type !== 'color'" checked="">
        <input type="color" title="Overlay Color" name="overlayColor" value="#ffffff" condition="overlay &amp;&amp; bg.type !== 'color'">
        <input type="range" inline="" title="Opacity" name="overlayOpacity" min="0" max="1" step="0.1" value="0.7" condition="overlay &amp;&amp; bg.type !== 'color'">
    </mbr-parameters>

    <div class="mbr-overlay" mbr-if="overlay &amp;&amp; bg.type!== 'color'" mbr-style="{'opacity': overlayOpacity, 'background-color': overlayColor}">
    </div>

    <div mbr-class="{'container': !fullWidth, 'container-fluid': fullWidth}" video-to-image-on-mobile="{{videoToImageOnMobile}}">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-{{textWidth}}">
                <div class="image-wrapper">
                    <img src="http://afu.bplaced.net/Bild.jpg" alt="Live-Bild">
                    <p class="mbr-description mbr-fonts-style mt-2 align-center" mbr-theme-style="display-4" mbr-if="showText" data-app-selector=".mbr-description">
                        Image Description</p>
                </div>
            </div>
        </div>
    </div>
</section>


Ich hoffe auf Hilfe.
Viele Grüße

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 04:36
von Tommy Herrmann
Moin,

und herzlich willkommen bei uns im Forum :hallo:

Bitte sei doch so nett und poste hier den Link zu Deiner Seite, sodass man in den Quelltext gucken und eventuell den Fehler finden kann, denn sonst ist das ja nur raten.

Das Bild selbst scheint ja vorhanden zu sein:

http://afu.bplaced.net/Bild.jpg

Wenn Deine Domain ein Zertifikat besitzt und somit ein sicheres Protokoll "https", dann muss das auch die URL des Bildes haben, die aber auf "http" (ohne Zertifikat) steht. Sonst wird das Bild nicht angezeigt.

Bitte im Internet auch immer den Browser-Cache (Pufferspeicher) löschen, bzw. neu laden mit der Tastenkombination:

Strg+F5 (am Desktop)

oder eventuell auch

Strg+Fn+F5 (am Laptop)

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:03
von danielodanio
Danke für die schnelle Antwort :)

Die Seite befindet sich hier: https://do5fdr.darc.de/livecam.html

Ich habe versucht, das Bild unter HTTPS aufzurufen, aber da erscheint, dass es keine sichere Verbindung sei und das Bild wird auch nicht angezeigt.

Edit:
Gerade habe ich festgestellt, dass ein Bild auf meiner Seite zwar angezeigt wird, aber das ist ein Platzhalter für "nicht gefunden". Wenn ich aber diesen Platzhalter im neuen Tab öffne, kommt mein gewünschtes Foto.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:11
von Volker
Wie Tommy schon schrieb. Http kann nicht in https eingebunden werden.
Alternativ das Bild im Iframe einbinden.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:18
von danielodanio
Ah, jetzt verstehe ich.
Das bild ist auf http gespeichert und kann in eine Seite, die https ist, nicht eingefügt werden, richtig?

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:21
von Volker
Richtig !

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:23
von danielodanio

Code: Alles auswählen

<section data-bs-version="5.1" class="image3" group="Images &amp; Videos" data-bg-video="{{bg.type == 'video' &amp;&amp; bg.value.url}}" mbr-class="{'mbr-fullscreen': fullScreen,
                    'mbr-parallax-background': bg.parallax}">
    <mbr-parameters>
        <header>Size</header>
        <input type="checkbox" title="Full Screen" name="fullScreen">
        <input type="checkbox" title="Full Width" name="fullWidth">
        <input type="range" inline="" title="Top" name="paddingTop" min="0" max="10" step="1" value="6" condition="fullScreen == false">
        <input type="range" inline="" title="Bottom" name="paddingBottom" min="0" max="10" step="1" value="6" condition="fullScreen == false">
        <input type="range" name="textWidth" title="Image" min="4" max="12" step="1" value="10">
        <header>Show/Hide</header>
        <input type="checkbox" title="Text" name="showText" checked="">
        <header>Background</header>
        <fieldset type="background" name="bg" parallax="">
            <input type="image" title="Image" value="../_images/background1.jpg">
            <input type="color" title="Color" value="#ffffff" selected="">
            <input type="video" title="Video" value="https://vimeo.com/428046504">
        </fieldset>
        <input type="text" title="Fallback Image" name="videoToImageOnMobile" condition="overlay &amp;&amp; bg.type === 'video'">
        <input type="checkbox" title="Overlay" name="overlay" condition="bg.type !== 'color'" checked="">
        <input type="color" title="Overlay Color" name="overlayColor" value="#ffffff" condition="overlay &amp;&amp; bg.type !== 'color'">
        <input type="range" inline="" title="Opacity" name="overlayOpacity" min="0" max="1" step="0.1" value="0.7" condition="overlay &amp;&amp; bg.type !== 'color'">
    </mbr-parameters>

    <div class="mbr-overlay" mbr-if="overlay &amp;&amp; bg.type!== 'color'" mbr-style="{'opacity': overlayOpacity, 'background-color': overlayColor}">
    </div>

    <div mbr-class="{'container': !fullWidth, 'container-fluid': fullWidth}" video-to-image-on-mobile="{{videoToImageOnMobile}}">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-{{textWidth}}">
                <div class="image-wrapper">
                    
                    <iframe src="http://afu.bplaced.net/Bild.jpg" name="Bild" id="Bild" scrolling="auto" frameborder="0" marginheight="0px" marginwidth="0px" height="800" width="600">
</iframe>
                    
                    
                    <p class="mbr-description mbr-fonts-style mt-2 align-center" mbr-theme-style="display-4" mbr-if="showText" data-app-selector=".mbr-description">
                        Image Description</p>
                </div>
            </div>
        </div>
    </div>
</section>
Wieder das Problem, in der Vorschau wird es angezeigt, im Browser nicht :/

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:28
von Tommy Herrmann
Ja genau.

Kopiere das Bild doch auf Deine Domain, die mit dem Zertifikat gesichert ist, und schreibe dann:

Code: Alles auswählen

<img src="https://DeineDomain.de/Bild.jpg" alt="Live-Bild">

Warum schreibst Du nicht mal die URL zu Deiner Domain, dann wüsste man eher zu helfen, so könnte es sein, dass ich Dir auch was Falsches schreibe.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:31
von danielodanio
Ja, das wäre natürlich die beste Idee, aber meine Kamera bekommt das nicht hin, über ftps auf den Server etwas zu speichern. Das hat letzte Woche schon der Kundendienst von Reolink versucht. Ich habe dann aus verzweiflung bplaced probiert, da geht es komischerweise/glücklicherweise. Jetzt suche ich dann mal nach einem Anbieter, der https hat.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:34
von Tommy Herrmann
ftps und https sind zwei unterschiedliche Sachen. Wenn Deine Domain - bitte einen Link (sonst kann ich nicht weiter helfen) - ein Zertifikat hat, dann muss auch ein Source-Code mit https beginnen, egal wie Du das Bild dort auf den Server kopiert hast.

https://de.wikipedia.org/wiki/Digitales_Zertifikat

https://www.ionos.de/sicherheit/ssl-zertifikat

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:36
von danielodanio
Also, meine Seite (https://do5fdr.darc.de/) ist https. Der Upload auf den Server dort muss in FTPS erfolgen.
Das soll die Kamera können, kann sie aber nicht wirklich. Deshalb hab ich bplaced (http://afu.bplaced.net/) probiert, da klappt der automatische Upload.

Edit: Kann man die Datei nicht von dem einen auf den anderen Server laden? Habe gelesen, das ginge über PHP, nur da bin ich absolut unerfahren ^^

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:40
von Tommy Herrmann
... na dann schreibe den absoluten Link auch so (wie das Beispiel in meinem letzten Posting). Dann kannst Du doch mit jedem FTP-Programm, wie z.B. "FileZilla" die Bilder einfach auf Deinen Server kopieren.

Wenn die Kamera das nicht kann, dann musst Du es eben mit FileZilla machen.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:45
von danielodanio
Es soll ja automatisch als Halb-Live gepostet werden. So das Ziel zumindest :/

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:49
von Tommy Herrmann
... ich habe auch Sicherheitskameras von "Netatmo", die kein SFTP-Protokoll können.

Früher konnte ich die Videos direkt auf meinen Server laden - jetzt lade ich diese über FTP auf die "Dropbox" und kann diese dennoch dort mittels "https" aufrufen.

Versuche das doch mal:

https://www.dropbox.com/

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 08:59
von danielodanio
Gibt es dazu ein Tutorial? Habe bei Google und Youtube nur etwas für lokales Speichern (localhost) gefunden.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 09:06
von Tommy Herrmann
Du - da habe ich mich noch nie mit beschäftigt. Melde Dich doch mal an bei Dropbox (pass auf, dass die Dropbox sich nicht auf Deinem PC installiert) und teste das. 2 GB Speicher sind kostenlos, 2000 GB (2TB) kosten - glaube ich - so um die 9,00 EUR im Monat.

Meine Sicherheitskameras haben da einfach einen Schalter "Mit Dropbox verbinden" und dort trage ich meine E-Mail als Benutzer-ID ein und fertig.

Jedes Video wird dann automatisch von den Kameras auf die Dropbox geladen.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 09:08
von Tommy Herrmann
Gucke mal hier - ich habe das jetzt aber selbst nicht gelesen ...

https://help.dropbox.com/de-de/installs ... s-overview

Dropbox hat auch eine eigene Community mit Forum.

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 11:16
von danielodanio
Ich habe es jetzt mit MultCloud.com geregelt. Das synchronisiert in Echtzeit von Bplaced.net auf den Server, wo meine Webseite liegt (darc.de). Danke für die Denkanregung und Unterstützung. :) :freude:

Re: Bild wird nur in Vorschau angezeigt, nicht im Netz

Verfasst: Sa 30. Apr 2022, 12:57
von Tommy Herrmann
... sehr gute Idee und prima, dass das nun auch klappt :tu:

Code: Alles auswählen

<img src="https://do5fdr.darc.de/Bild.jpg" alt="Livebild nicht verfügbar">
Alle Zeiten sind UTC+02:00
Seite 1 von 1

Powered by phpBB® Forum Software © phpBB Limited

Deutsche Übersetzung durch phpBB.de