Search code examples
javascriptdomsafarimultipartmjpeg

Safari open and close img MIME type multipart / x-mixed-replace streaming on demand


testing a mobile Safari web application, I find that I have an image in your tag img src changes dynamically. This src reference to a url that generates a streaming mjpeg with MIME type multipart / x-mixed-replace. Changing the src notice that the browser does not close the connection to the server, so the server continues to process as if asking follow the streaming client and should not do and that does not exist in the DOM. I already try to use the methods remove and empty jquery API and assign the src to null or an empty string without getting them to behave the way they do the classic browsers. It is possible to achieve this? thanks


Solution

  • In case you are still looking for an answer, I had the same problem in older version of chrome (not tested with safari but may be the same solution) and the only thing that worked for me was calling window.stop(). This will stop all connection in the page so if there is things you don't want to stop, you can put your image inside an iframe and call stop on the iframe window.

    • Add the iframe:

      <iframe id="image" src="" seamless="seamless"><p>Your browser does not support iframes.</p></iframe>
      
    • Add the image:

      var frame = document.getElementById('image');
      var img = document.createElement("img");
      img.src = myImgSource;
      frame.contentDocument.body.appendChild(img);
      
    • And when you want to change the img src, call this stopLoad function on the iframe before:

      function stopLoad(frame) {
         var cw = frame.contentWindow;
         if (cw.stop) {
            cw.stop();
         } else {
            cw = frame.contentDocument;
            if (cw.execCommand) {
               cw.execCommand("Stop", false);
            }
         }
      }
      

    You may need to add some style to the iframe and its content so the image appears like if it was directly in the main window.