Search code examples
javascriptandroidflaskmjpeg

Cant abort MJPEG in android "internet" app, or android chrome


I have a python/flask application that sends mjpeg video to a element. It works fine regarding the streaming, but I have a problem aborting the video. To abort the video at my phone (android) I have to click a link to another page or else the stream continues.

Currently I am controlling the stream with javascript. Setting the "src" to either a url for a static image from the cam, or an url to the video stream. But between the src-change I first change it to "#".

A problem, using flask, is that when 1 client is receiving the stream (using generator & yield) no other cant communicate with the server. This might be the source to the problem?!

So, With javascript I control the stream with the following code:

if (streaming==false){
    document.getElementById(img_id).src=C_vidsource;
    streaming = true;
} else {
    var currDate = new Date();
    document.getElementById(img_id).src="#";
    document.getElementById(img_id).src=C_statimage + "?" + currDate.getTime();
    streaming = false;
}

I control this using a simple

I Think that androids web browser differ from the one I am using on the computer. It seems like it tries to download content before changing anything on the page. So it lets the videostream continue until the new image is loaded. But the new image will not be loaded until the stream has stopped.

is there a way to solve this?

Thanks!


Solution

  • Directly after i posted the question I found the solution.

    I added an delay between the two src-changes. after:

    document.getElementById(img_id).src="";
    

    I added

    sleep(1000);
    

    And sleep is a function I created (a very dirty):

    function sleep(ms){
        stoptime = Date.now() + ms;
        while(Date.now() < stoptime){ }
        return;
    }
    

    I guess that for a longer sleep this is not a good solutoion, but it solves my problem, or at least gives me a hint about what to search for.