Refresh immagine da webcam 
Author: Federico C.Ciao a tutti!
Al momento ho due siti web, nel primo visualizzo due webcam che, tramite due script che ho inserito direttamente nell'html aggiornano correttamente l'immagine ad ogni refresh.
Il primo script fa partire un php posto sul server e serve a rinominare la foto con un nome fisso e a cancellare le foto più vecchie:
<script language="JavaScript" type="text/JavaScript">
$(document).ready(function () {
var refreshId = setInterval(function()
{
$('#updateDiv2').load('https://www.beerox.it/foscam/FI9902P_00626EA781E5/snap/webcam_fi_9900p.php');
}, 5000);
});
</script>
Il secondo aggiorna l'immagine con lo stesso nome e fa il refresh:
<script type="text/javascript">
(function() {
setInterval(function() {
var myImageElement = document.getElementById('costarei');
var d = new Date();
//4000 sono 4 secondi;
var timeSlice = Math.random(d.getTime() / 4000) % 3;
myImageElement.src = 'https://www.beerox.it/foscam/webcam.jpg?t=' + timeSlice;
}, 4000);
}());
</script>
ora, sul sito www.beerox.it che ho realizzato secoli fa scrivendo direttamente il codice funziona correttamente (faccio il referesh e aggiorna l'immagine). Sul sito www.isospiteddi.it dove utilizzo solo un'immagine, realizzato con Website invece non riesco a farlo funzionare... Ho provato ad aggiungere i due script sia direttamente all'interno della pagina che nel header o nel footer ma nulla...
Dove sbaglio?
Grazie...
... in genere l'attributo SRC nel tag <IMG> e nel tag <IFRAME> in Oggetto Codice HTML dovrebbe automaticmente by-passare la cache(!)...
... puoi provare direttamente e verificare...
..........................................................
... oppure, per l'attuale immagine “Costa_Rei” in “Oggetto Immagine” del link che hai postato, si potrebbe usare una mi esclusiva invenzione infallibile(!) basata anche sul rilevamento dell'immagine...
... se ti interessa in questo modo EXTRA. ...avvisami, che ti posto il mio codice...
.
Author
Credo che l'immagine (secondo script) si "refresha" correttamente.
Penso che il problema sia nel primo script... se faccio girare il php dalla barra degli indirizzi in un'altra finestra e poi aggiono il sito "isospiteddi" la foto viene caricata correttamente. E' come se il primo script posto in website non viene eseguito (l'ho inserito come html prima dell'immagine)...
C'è un modo alternativo per eseguire/richiamare ogni 5 secondi il php in backgroud su website?
Author
Direi che è il primo script a non funzionare. Aruba, lato server, fa girare il php schedulato ogni 30 minuti (valore minimo) e ogni mezz'ora la foto viene correttamente caricata. Perciò direi che il mio errore stà o nella sintassi del primo scrip che website non lo riconosce o nel suo posizionamento...
... vedo che in Costa Rei non funziona il refresh, e mi pare che hai indicato un selettore inesistente...
... per tagliare la testa al toro, togli il tuo script ed usa il mio che funziona per quella pagina(*) con cadenza di 1 minuto, incollandolo o in /head o in Oggetto Codice HTML:
<script>
/** --- refresh temporizzato x WSx5 Oggetto Immagine by KolAsim ---**/
$( document ).ready(function() {//K>
imgK="https://www.beerox.it/foscam/webcam.jpg?";
imgRefreshK() ;
setInterval(function(){ //K1>
imgRefreshK() ;
},60000);//K1<<
}) //K<<
function imgRefreshK() {//K2>
cacheK=new Date().getTime();
$("#imObjectImage_28_container img").attr("src", imgK+cacheK);
} //K2<<
</script>
.
(*) ... negli orari in cui la webcam è attiva; ... dopo le ore 20:00 mi pare inerte...
.
Author
Grazie, ho provato il tuo script ma non cambia nulla (la cam comunque è attiva 24/7 e manda ogni 30 secondi un'immagine al server aruba).
Ho visto che quello che non funziona il primo script che fa girare il php (webcam_fi_9900p, che rinomina l'ultima immagine spedita dalla webcam e ne cancella tutte le altre vecchie) infatti questo viene richiamato anche dalla schedulazione aruba ogni 30 minuti e in effetti il sito isospiteddi.it fa il refresh dell'immagine ogni 30 min...
Avevo fatto richiamare questo php anche dalla pagina in modo che lo aggiornasse appena entrati mettendolo anche lui nell'oggetto codice html ma non funziona...
Dovrebbe fare un reload ogni 5 secondi (e su beerox.it lo fa...) su isospiteddi.it invece nulla, neanche se riaggiorno la pagina.
Author
Fermi tutti... Mea culpa...
Trovato il problema. Mi sono dimenticato di richiamare l'update del primo script, manca:
<div id="updateDiv2"> </div>
prima dello scrip, errore di copia e incolla....
Adesso funziona tutto!
Grazie!
Author
Qui ci sono i fantasmi... Adesso lo script su www.isospiteddi.it funziona alla perfezione ma l'ho copiato e messo su www.beerox.it (duplicato per due webcam) e non funziona più... Il posizionamento nella pagina è identico e non vedo grosse differenze tra i due siti, Che motivazione ci potrebbe essere? Ho provato a separare i due html e anche a metterli in due pagine separate ma non cambia nulla, le immagini si aggirnano random a volte neanche quando si fa il refresh...
...non entro nel merito del tuo codice, avendo la certezza che il mio codice esclusivo per WSx5 funziona sempre in qualsiasi occasione...
... per esempio, generalizzando il mio codice, e prendendo in considerazione il solo l'URL della tua webcam, funziona direttamente e ovunque e in qualsiasi pagina lo si applichi...
...come funziona adesso a me, puoi provarlo immediatamente anche anche in locale, incollando questo codice in Oggetto Codice HTML, in qualsiasi pagina di qualsisia progetto; ...ho inserito anche un effetto “flash” per percepire il refresh-cambiamento cadenzato ad 1 minuto:
<img id="imgK" src="https://www.beerox.it/foscam/webcam.jpg" width="100%">
<script>
/** --- refresh temporizzato x WSx5 Oggetto Immagine by KolAsim ---**/
$( document ).ready(function() {//K>
imgK="https://www.beerox.it/foscam/webcam.jpg?";
imgRefreshK() ;
setInterval(function(){ //K1>
imgRefreshK() ;
},60000);//K1<<
}) //K<<
function imgRefreshK() {//K2>
cacheK=new Date().getTime();
$("#imgK").attr("src", imgK+cacheK);
//flash
$("#imgK").hide()
$("#imgK").show(1000)
} //K2<<
</script>
.
ciao
.
Author
Ciao e grazie, il codice che ho usato era quello che mi avevi dato tu l'altra volta sia per la prima che per la seconda immagine (cambiando il suffisso img nella seconda), poi ho provato a diversificare usando per una il tuo e per una il mio ma facevano lo stesso...
Adesso ho provato ad aggiungere, come hai fatto tu nell'ultimo post, la foto nell'html ed effettivamente funzionano entrambe...
Prima io l'immagine la mettevo separatamente come "oggetto immagine" (così ho anche fatto nel sito isospiteddi però li funziona correttamente!!!) ma senza l'"img id" (non ho trovato dove impostarlo nell'oggetto) linkata come file da url.
Hai idea del motivo per cui da una parte funziona con un'immagine "pescata" dall'oggetto immagine (senza id) e dall'altra parte devo incorporare un html?
Grazie
... ho voluto visionare lo stesso la tu pagina, e per il mio codice che ho visto inserito, i selettori non corrispondono quelli che avevo in precedenza rilevato...
... hai in attivo refresh 4 secondi che disturbano...
... per me il codice che richiama il PHP non serve, dovrebbe essere eliminato...
... fermo restando la struttura attuale, senza modifica degli ID dei selettori, per refreshare le due immagini, Tieste e Cost Rei, ed usare il mio codice:
... togli tutti gli script attuali...
... per ambedue le immagini webcam della pagina incolla questo mio codice nelle Proprietà della Pagina, Sezione Esperto, 3^opzione (x/head):
<script>
/** --- refresh temporizzato x WSx5 Oggetto Immagine by KolAsim ---**/
$( document ).ready(function() {//K>
imgK1="https://www.beerox.it/foscam/webcamTS2.jpg?"; // Trieste
imgK2="https://www.beerox.it/foscam/webcam.jpg?"; // Costa Rei
imgRefreshK() ;
setInterval(function(){ //K1>
imgRefreshK() ;
},60000);//K1<< // 60000 = 1 minuto
}) //K<<
function imgRefreshK() {//K2>
cacheK=new Date().getTime();
$("#imObjectImage_65_06_container img").attr("src", imgK1+cacheK);
$("#imObjectImage_65_12_container img").attr("src", imgK2+cacheK);
} //K2<<
</script>
.
ciao
.
.
... oppure in alterntiva, puoi anche incollare il mio codice in un Oggetto Codice HTML > scheda HTML...
... quando avrai fatto, avvisami che vado a controllare...
.
... visto che hai confermato che il mio codice generalizzato ti funziona, per semplificare al massimo senza essere vincolati con gli ID del Progetto che potrebbero venirsi a modificare in caso di modifiche alla struttura della pagina, puoi usare individualmente, webcam per webcam il mio codice, non con Oggetto Immagine, ma appunto con semplice Oggetto Codice HTML, come l'ultimo che avevi provato prima...
... per questo ti basta usare ID tuoi evitando confusioni, sia nel tag <img> che nel relativo <script>, il tutto nello tesso oggetto codice html per il massimo controllo...
.
Author
Il codice php serve perché la webcam invia via ftp immagini con anche data e ora e il php rinomina l'ultima immagine in "webcam.jpg" e cancella tutte le precedenti (viene fatto girare anche lato server con scadenza 30 minuti per evitare l'accumulo di immagini obsolete) lo faccio richiamare dalla pagina web così ho le immagini aggiornate anche con step minori di 30 minuti.
Ho abbassato a 4 secondi il refresh perché, a regime, le immagini dovrebbero esser scaricate dalle webcam ogni 5 secondi e non ogni 30.
Comunque, fatta la modifica che mi hai consigliato ma come puoi vedere non funziona più...
Author
Rimetto la versione precedente con i due script separati nell'html della pagina, grazie mille dell'aiuto.
Ciao
... no no! ... adesso è OK con il codice ripulito e senza richiamo php, (che funge lato server)...
... ho controllato adesso, e il refhesh con il mio codice che hai applicato nella sezione giusta funziona correttamente in ambedue le immagini...
...visto il tipo di rilevamento, personalmente alleggerirei alzando il tempo ad un minuto e/o meglio se ancor di più...
.
ciao
.