浏览器禁用了自动全屏Failed to execute ‘requestFullscreen‘ on ‘Element‘: API can only be initiated by a user...

这个错误信息 "Failed to execute 'requestFullscreen' on 'Element': API can only be initiated by a user gesture" 指的是在Web开发中，尝试通过JavaScript代码调用requestFullscreen()方法来使一个元素进入全屏模式时，这个调用没有成功，因为它违反了浏览器的安全策略。

原因

现代浏览器出于安全考虑，限制了许多可以自动执行的功能，特别是那些可能会影响到用户体验或隐私的功能。全屏模式是一个显著的例子，因为它会改变用户的屏幕布局和可视内容。因此，浏览器要求全屏模式的请求必须是由用户的直接操作（如点击或触摸事件）触发的。

解决方案

1. 确保全屏请求是由用户交互触发的：
   将requestFullscreen()方法的调用放在一个事件监听器内部，这个监听器应该监听用户的某个交互事件，如点击或触摸事件。例如：

   document.getElementById('myButton').addEventListener('click', function() {
       var elem = document.documentElement; // 例如，使整个页面进入全屏
       if (elem.requestFullscreen) {
           elem.requestFullscreen();
       } else if (elem.mozRequestFullScreen) { /* Firefox */
           elem.mozRequestFullScreen();
       } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
           elem.webkitRequestFullscreen();
       } else if (elem.msRequestFullscreen) { /* IE/Edge */
           elem.msRequestFullscreen();
       }
   });
   

2. 避免在文档加载或脚本执行时自动调用全屏：
   不要将requestFullscreen()放在如window.onload或DOMContentLoaded等自动执行的事件处理程序中。