Javascript 全屏请求在 chrome 中被拒绝

Question

我正在尝试制作 html5 canvas 全屏，所以我使用了 javascript api 和一个按钮来全屏。

这是 html 按钮代码：

<button onclick="fullscreen()">Pantalla completa</button>

全屏功能如下所示：

function fullscreen(){
    var elem = myGameArea.canvas;

    try {
        if (elem.requestFullscreen) {
            prom = elem.requestFullscreen();
        } else if (elem.mozRequestFullScreen) { /* Firefox */
        elem.mozRequestFullScreen();
        } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
            elem.webkitRequestFullscreen();
        } else if (elem.msRequestFullscreen) { /* IE/Edge */
            elem.msRequestFullscreen();
        }         
    }
    catch (error) {
        console.error(error);
    }
}

这适用于 mozilla firefox，但在 chrome 中它给出了错误： Browser console error

我不明白为什么，因为我在用户交互时调用它，按下按钮。

Answer 1

你没有说你正在使用 iframe 元素，所以你需要添加 allow="fullscreen" 属性才能做到这一点

Javascript 全屏请求在 chrome 中被拒绝

Javascript fullscreen request is being rejected in chrome

javascript

google-chrome

web

html5-canvas

fullscreen