Cześć,

mam skonfigurowaną kamerkę do wysyłania zdjęcia po wykryciu ruchu na FTP. Chodzi mi o to żeby na stronie internetowej aktualizowało się zdjęcie bez konieczności ręcznego odświeżania strony w przeglądarce.

Chciałbym, aby skrypt sprawdzał czy pojawiło się nowsze zdjęcie i dynamicznie je podmieniał.

Jak się do tego zabrać?

ustaw crona.

1. WebSockets - na serwerze skrypt na bieżąco sprawdza czy się pojawiło coś nowego w katalogu - jeśli tak to śle info do przeglądarki.
2. SSE - https://en.wikipedia.org/wiki/Server-sent_events
3. Ewentualnie, jako opcja zapasowa - jakiś long-pooling, gdzie przeglądarka w pętli odpytuje serwer czy jest coś nowego

Próbowałem zrobić to w ten sposób:

[HTML] pobierz, plaintext 
<script type="text/javascript">
let temp;
function ZmianaObrazka() {
	if(temp=="1.jpg") {
		temp="2.jpg";
	}
	else {
		temp="1.jpg";
	}
	document.getElementById("imgid").src=temp;
}
setInterval("ZmianaObrazka()", 1000);
</script>
 
<img src="1.jpg" id="imgid" style="width:20%" />
[HTML] pobierz, plaintext 

Problem w tym, że obrazek jest pobierany z pamięci podręcznej przeglądarki, a nie z serwera. Da się to obejść?

poprostu dodawaj kolejny numer do zdjecia cos ala

temp="1.jpg?I_tu_kolejny_numer_po_znaku_zapytania";

Dzięki, stworzyłem takiego potworka i na razie mi to wystarczy.

[HTML] pobierz, plaintext 
<script type="text/javascript">
let i=1;
let file;
function ZmianaObrazka() {
	if(i==1) {
		file="2.jpg";
		i=2;
	}
	else {
		file="1.jpg";
		i=1;
	}
	file=file+"?"+Math.floor(Math.random()*9999999);
	document.getElementById("imgid").src=file;
}
setInterval("ZmianaObrazka()", 1000);
</script>
 
<img src="1.jpg" id="imgid" style="width:20%" />
[HTML] pobierz, plaintext