uni-app x5 内核 webview H5页面视频播放全屏按钮灰色 无法全屏

在 uni-app 中使用 X5 内核的 WebView 加载 H5 页面时，如果视频播放的全屏按钮是灰色且无法点击，可能是由于以下原因导致的：

1. X5 内核的全屏限制

X5 内核（腾讯浏览服务的内核）对视频播放有一些特殊的限制，特别是全屏播放。默认情况下，X5 内核可能不允许通过 JavaScript 控制全屏播放，或者需要特定的配置才能启用全屏功能。

2. H5 页面的全屏 API 问题

H5 页面中使用的全屏 API 可能与 X5 内核不兼容。通常情况下，H5 页面会使用 requestFullscreen 方法来触发全屏，但 X5 内核可能不支持这种方式。

3. X5 内核的全屏模式配置

X5 内核默认使用自己的视频播放器（TBS 内核播放器），而不是原生的 HTML5 视频播放器。因此，可能需要通过配置来启用全屏功能。

解决方案

1. 启用 X5 内核的全屏功能

在 uni-app 的 manifest.json 中，可以配置 X5 内核的相关设置，启用全屏功能：

{
  "app-plus": {
    "webview": {
      "x5": {
        "videoFullscreen": true
      }
    }
  }
}

这个配置会启用 X5 内核的视频全屏功能。

2. 使用 X5 内核的视频播放器

X5 内核提供了自己的视频播放器，可以通过以下方式强制使用 X5 的视频播放器：

<video controls x5-video-player-type="h5" x5-video-player-fullscreen="true">
  <source src="your-video.mp4" type="video/mp4">
</video>

通过添加 x5-video-player-type 和 x5-video-player-fullscreen 属性，可以强制使用 X5 的视频播放器，并启用全屏功能。

3. 检查 H5 页面的全屏逻辑

如果你在 H5 页面中使用了自定义的全屏逻辑，确保它与 X5 内核兼容。你可以尝试使用 X5 内核提供的全屏 API 来触发全屏：

if (window.navigator.userAgent.indexOf('TBS') > -1) {
  // 使用 X5 内核的全屏 API
  videoElement.requestFullscreen = videoElement.webkitRequestFullscreen || videoElement.mozRequestFullScreen || videoElement.msRequestFullscreen;
  videoElement.requestFullscreen();
} else {
  // 使用标准的全屏 API
  videoElement.requestFullscreen();
}