javascript - 三星互联网浏览器使用 html5 流上传 - 相机卡住

Question

我的系统有一部分从 html5 中的移动网络应用程序上传流，它适用于 Android 上的 chrome 浏览器，在三星互联网浏览器中，图片有时从记录开始不断卡住，有时在记录期间突然卡住，我已经复制通过在录音时打断电话，有什么想法吗？

视频标签和约束定义如下:

video = document.getElementById('vid');
video.setAttribute('autoplay', '');
video.setAttribute('muted', '');
video.setAttribute('playsinline', '');

video.style.width = '160px';
video.style.height = '90px';


//constraints:
video: {
        mandatory: {
            minWidth: CANVAS_WIDTH,
            minHeight: CANVAS_HEIGHT,
            maxWidth: CANVAS_WIDTH,
            maxHeight: CANVAS_HEIGHT
        }

Answer 1

我认为您可能需要处理可见性更改事件并停止/恢复摄像头访问我建议您将应用程序移植到 Cordova 并使用事件在后台或前台模式下处理应用程序。为此，您可以在这里查看:how to check mobile web browser is running in foreground or background on mobile device

如果您被迫使用标准网络浏览器，那么您可以查看以下页面并尝试此操作，但由于它是实验性的，因此不能保证它会正常工作。

取自https://greensock.com/forums/topic/10051-animations-pause-when-browser-tab-is-not-visible/ .

var vis = (function(){
    var stateKey, 
        eventKey, 
        keys = {
                hidden: "visibilitychange",
                webkitHidden: "webkitvisibilitychange",
                mozHidden: "mozvisibilitychange",
                msHidden: "msvisibilitychange"
    };
    for (stateKey in keys) {
        if (stateKey in document) {
            eventKey = keys[stateKey];
            break;
        }
    }
    return function(c) {
        if (c) document.addEventListener(eventKey, c);
        return !document[stateKey];
    }
})();

用法:

// check if current tab is active or not
vis(function(){

    if(vis()){  

    setTimeout(function(){  
            // tween resume() code goes here          
            console.log("tab is visible - has focus");
        },300);     

    } else {

        // tween pause() code goes here
        console.log("tab is invisible - has blur");      
    }
});