• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild auf Webseite automatisch erneuern

Status
Für weitere Antworten geschlossen.
B

Baumeister

Neues Mitglied
Hallo,
ich möchte ein Foto auf meiner Webseite, welches von einer Webcam alle 30 Sekunden neu in den Bilderordner auf dem Server gespielt wird, alle 30 Sekunden aktualisieren.
Man sagte mir an anderer Stelle, das wäre ein Fall für JS ?
Ich hatte es mit <refresh> versucht, dort wird aber die ganze Seite erneuert, was eigentlich nicht sein soll.

Hat da jemand eine Lösung ?
 
Werbung:
inlineframe ? Okay, und dann habe ich das Bild darin, fehlt aber noch die 30-Sekundige Aktualisierung, wie setze ich die um ?
 
Werbung:
HAllo mermshaus,
das sieht übersichtlich aus, ich als JS-Neuling bräuchte da aber nochmal Anschubhilfe.

Add the header with a reference to jquery.
<html>
<head>
<script type="text/javascript" src="js/jquery.js">
</script>

Wo ist diese js/jquery.js Datei ?

Set the refresh interval on document ready, calling our function reloadImages()
<script type="text/javascript">
$(document).ready(function() {
setInterval('reloadImages()', 60000); // 60 seconds
});
Add our function reloadImages to reference our image ID of c131a in this case. Then change the src image to the same name plus some random attribute to prevent caching.
function reloadImages()
{
$('#c131a').attr('src', 'c131a.jpg?' + Math.random());
}
</script>

Hier haperts an meinem Englisch, was genau ist hier zu tun ? Ist das ein Befehl ? Wo füge ich meinen Bilderpfad ein ?

n the body of the script, add a normal image reference making sure the id matches the one in the above reloadImages function.
<title>Cams</title>
</head>
<body>
<img src="c131a.jpg" id="c131a" border="1" />
</body>
</html>

Das ist noch am klarsten, anstelle des c131a.jpg setze ich mein cam.jpg ein - und in "c131a" einfach "cam" ?
 
nachdem du (lt. erstem post) mit refresh umgehen kannst, warum machst du das nicht damit?
meine antwort bezog sich darauf, mit refresh eine lösung zu finden, die die webseite nicht immer neu läd. lässt du deine lösung in einem iframe lafen, kannst du deine lösung beibehalten.

die js lösung würde hier in der firma z.b. nicht laufen, da js abgestellt ist....
 
Werbung:
Ja, stimmt eigentlich, die iframe-Lösung ist wohl günstiger in Sachen Webcam. Ich habe es offenbar nicht mehr so recht auf dem Schirm, dass man mit "Frames" tatsächlich sinnvolle Dinge tun kann. Pardon. :)
 
Ich hatte da diesen Befehl.

<META HTTP-EQUIV=REFRESH CONTENT="5; URL=index.html">

Der steht ja im <head>.
Wo baue ich denn beim <iframe> ein ?
 
Ich hätte mal eine andere Idee.

Das Bild mittels <img> einfügen und beim Bild den HTTP-Header Refresh: 30; url=foobar.jpg benutzen. Kann mal jemand testen, ob das funktioniert und in welchen Browsern?
 
Werbung:
@crash: Puh. Interessant. Ausprobieren will ich das wohl nachher mal. Ich kann mir nicht vorstellen, dass das klappt, aber einen Grund, der dagegen spricht, habe ich spontan auch nicht. :)

@Baumeister: Du lädst in den iframe eine weitere eigenständige HTML-Seite. Dieser setzt du (iirc) im Header wie bereits erklärt den entsprechenden Refresh-Tag. SELFHTML: HTML/XHTML / Frames / Eingebettete Frames
 
Test für crashs Idee:

PHP: 
<?php

$url = 'http://' . $_SERVER['SERVER_NAME'] . $_SERVER['SCRIPT_NAME'] . '?image';

if (isset($_GET['image'])) {
    header('Content-type: image/png');
    header('Refresh: 2; url=' . $url);
    header('Cache-Control: no-cache, no-store, max-age=0, must-revalidate');
    header('Expires: Mon, 26 Jul 1997 05:00:00 GMT'); // Date in the past
    header('Pragma: no-cache');
    header('Keep-Alive: 300');
    header('Connection: keep-alive');

    // Irgendein Bild mit Uhrzeit aus der PHP-Dokumentation
    $im = @imagecreate(110, 20)
        or die("Cannot Initialize new GD image stream");
    $background_color = imagecolorallocate($im, 0, 0, 0);
    $text_color = imagecolorallocate($im, 233, 14, 91);
    imagestring($im, 1, 5, 5,  date('H:i:s'), $text_color);
    imagepng($im);
    imagedestroy($im);
    exit;
}

?><!DOCTYPE html>

<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Demo</title>
    </head>

    <body>

        <h1>Ein Bild</h1>

        <p><img alt="demo" src="<?php echo $url; ?>" /></p>
    </body>

</html>

Ich habe alles an Headern reingepackt, was mir so einfiel, aber da bin ich kein Experte. Jedenfalls aktualisieren weder IE6, IE8 noch Firefox 3.5.7 das Bild innerhalb des <img>-Tags, aber alle aktualisieren es beim direkten Aufruf über die URL mit dem ?image-Parameter (und machen dazu dieses "Klack"-Geräusch ;)).

Edit: Lust, in die RFCs oder so zu gucken, habe ich aber nicht.

@Baumeister: Woran hapert es denn? Die SELFHTML-Seite sollte es doch eigentlich erklären.
 
Werbung:
Also ich habe es nun über das Inlineframe gelöst, Ich habe eine seperate Seite nur mit dem Bild angelegt und hochgeladen. Diese Seite habe ich als <iframe> eingebunden und mit dem meta fresh wird sie alle 30 Sekunden aktualisiert.
Was mich nur ein wenig stört ist der Rahmen vom frame, den man beim Betrachten der Webseite sieht.
Ansonsten ist die Funktion voll erfüllt.
Vielen Dank für Eure Mühe.

Gruß
Axel
 
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben