jQuery/ajax ile görüntü besleme yenilemesi

Question

Birden fazla çıkışa sahip olan, biri jpg resmi olan bir Axis kameram var. Bu görüntü, yüklediğiniz anda fotoğraf makinesinden alınmıştır. Tüm sayfayı yeniden yüklemeye gerek kalmadan görüntünün yeniden yüklenmesi için (30 saniyede bir) bir yol uygulamak isterim, ancak boş bir ekrana sahip olmaktan kaçınmak için kodun görüntüyü güncellemeden önce tam olarak indirmesini istiyorum.

Etrafımı okudum ve bulduğum en yakın şey bu mesaj Using AJAX/jQuery to refresh an image idi ama fark ettiğim resim beslemesinin gerçek kameradan kendisinin bir php dosyası olmaması. Bu çalışmayı url'mle çalışmak için birkaç yol denedim ama javascript bilgisinin eksikliğinden dolayı başarısız oldum.

Ben görüntüyü yukarı çekmek için şu anda kullanıyorum kod sadece basit bir görüntü etikettir ...

<img src="[camera ip]/jpg/1/image.jpg">

ve tarayıcı penceresini yenileyin herhangi seferindeki bir anlık verir geçerli video akışı.

Herhangi bir yardım büyük takdir!

Selamlar,
Javier

Answer 1

bu karşı test edilecek, ancak bu sizin için hile gerektiğini düşünüyorum ... ya da en azından gerçekten yakın olsun

<script> 
// URL to your cam image 
var cam_image = 'http://absdev.ws:8000/jpg/1/image.jpg'; 

var buffer = {}; 
function preload() { 
    buffer = new Image(); 
    // attaching the seconds breaks cache 
    buffer.src = cam_image + '?' + (new Date()).getTime(); 
    buffer.onload = function() { 
     setTimeout(preload, 30000); // 30 seconds refresh 
     document.getElementById('myimg').src = buffer.src; 
    } 
} 
preload(); 
</script> 

Answer 2

resimlerden oluşan statik grubuyla çalışıyorsanız - Zaten dosya biliyorum ve değişecek değil - Başlangıçta html içine her şeyi yük olur (yani boş ekran çözer endişe), daha sonra, belirttiğiniz aralıkta görüntüleri döndürmek/yenilemek için bir jquery eklentisi kullanın, 30 saniye ya da her neyse. içlerinden

<ul> 
    <li><img src="[camera ip]/jpg/1/image.jpg"></li> 
    <li><img src="[camera ip]/jpg/2/image.jpg"></li> 
    <li><img src="[camera ip]/jpg/3/image.jpg"></li> 
    ... 
</ul> 

Ve sonra eklenti olur döngüsü:

Yani, html böyle bir şey olmazdı.

eklentileri için

, bu ikisinden birini kullanın:

http://nivo.dev7studios.com/

http://jquery.malsup.com/cycle/

İyi şanslar!

... Ben ferahlatıcı görüntü ile çevrimiçi bir web kamerası bulamadı