Change Image Every Second Using Php And Javascript

I have a small script written in JavaScript that is used to change picture every second. The problem is that image is not being changed. The image file that shuld be displayed is o

Solution 1:

ajax method:

may need to specify different content-type in the header.

$.ajax({
  method: 'get',
  url: 'camera_stream_worker.php?time=' + Date.now()) 
}).success(function(data) {
  $('#image').html(data);
})

Could be that the image names are all the same, therefore it doesn't get new ones. try to add a timestamp to your images:

<?phpecho'<img src="/RAMdisk/image.jpg?<TIMESTAMPHERE>" />';
?>

this answer assumes the result were image srcs.

have you tried changing the src instead of load?

<scripttype="text/javascript">var auto_refresh = setInterval(function (){
            $('#image').attr('src', 'camera_stream_worker.php?time=' + Date.now());}
    , 1000);
</script>

Solution 2:

The issue here appears to be the fact you are returning an html document instead of just the image that is changing. The HTML has a hardcoded image.jpg in the source and since that does not change it is being pulled from the cache.

What you would need to do is change that image source to fetch the latest image and not update the entire html snipplet around it.

Other option is to make the php append the timestamp to the html.