如何强制Chrome浏览器接受.requestFullscreen()？

Question

我正在为自己编写一个应用程序，其中需要通过JavaScript自动全屏（今天我模拟按下F11键，通常有效，但并非总是如此）。

我想使用 .requestFullscreen（）（通过 screenfull.js ），但我收到以下错误信息：

在“元素”上执行“requestFullscreen”失败：API只能由用户手势启动。

出于安全/垃圾邮件/可用性原因，这是可以理解的，并在许多页面中提到。

既然这是在我的Chrome浏览器上运行的应用程序，我希望能够在我的浏览器中允许此请求。这是Chrome的可能设置吗？

- WoJ

---

如果这是你的应用程序和你的浏览器，你将不得不按下你的F11才能使其工作。在任何现代浏览器上，全屏模式都不能再通过脚本激活了。 - ThoriumBR

@ThoriumBR：我希望有一个开关或chrome://某些设置。这是一个无键盘的设置（服务器和屏幕），所以我将回到模拟的F11。谢谢。 - WoJ

我使用你提供的新信息发布了一个答案。它完全改变了问题。 - ThoriumBR

Answer 1

你可以使用 kiosk 模式：

在 Windows 上：

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --chrome --fullscreen --kiosk http://10.20.30.40/page/

在Linux上

chrome  --chrome --fullscreen --kiosk http://10.20.30.40/page/

- ThoriumBR

Answer 2

全屏API有点令人困惑，因为目前没有浏览器接受纯粹的“未加前缀”的版本。Mozilla在这里提供了全屏API的相当好的解释here，并列出了适当的前缀。

所以要在Chrome中全屏显示，实际上需要调用.webkitRequestFullscreen()。如果您想支持多个浏览器，您需要使用if-else块来确保您拥有所有正确的前缀，就像这样：

if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.webkitRequestFullScreen) {
    elem.webkitRequestFullScreen();
  } else if (elem.mozRequestFullScreen) {
    elem.mozRequestFullScreen();
  } else if (elem.msRequestFullscreen) {
    elem.msRequestFullscreen();
  }

这很丑，但不幸的是它是必要的。您还需要为退出全屏添加适当的前缀，并在应用任何CSS时添加前缀。您可能会遇到的最后一个错误是，在全屏模式下，Webkit浏览器不会以全尺寸显示元素，因此您需要将以下内容添加到样式表中。

-webkit-full-screen {
  width: 100%;
  height: 100%;
}

- gmferland