移动端获取上传的视频封面为第一帧

您可以使用HTML5的File API在移动端获取上传视频的第一帧图片。具体步骤如下：

1. 通过一个input元素来实现视频的选择和上传，例如：

<input type="file" accept="video/*" onchange="handleFileSelect(event)">

其中accept属性指定了上传文件的类型为视频类型。

2. 定义一个handleFileSelect函数来处理选择的视频文件。在该函数中，我们可以使用FileReader对象来读取视频文件，并在load事件的回调函数中获取视频的第一帧图片。例如：

function handleFileSelect(event) {
  var file = event.target.files[0];
  var video = document.createElement('video');
  var reader = new FileReader();
  reader.onload = function(e) {
    video.src = e.target.result;
    video.addEventListener('loadedmetadata', function() {
      var canvas = document.createElement('canvas');
      canvas.width = this.videoWidth;
      canvas.height = this.videoHeight;
      canvas.getContext('2d').drawImage(this, 0, 0, canvas.width, canvas.height);
      var dataUri = canvas.toDataURL();
      // 将dataUri作为视频的第一帧图片
    });
  };
  reader.readAsDataURL(file);
}

在这段代码中，我们首先获取选择的视频文件，然后创建一个video元素和一个FileReader对象。当FileReader对象的load事件触发时，我们将视频文件的内容读取到video元素中，并监听video元素的loadedmetadata事件。在loadedmetadata事件的回调函数中，我们可以获取视频的第一帧图片，并将其转换为data URI，最终将其作为视频的封面图片。

需要注意的是，由于视频文件可能比较大，因此读取文件的过程可能比较耗时，在移动端可能会卡顿。因此，您可以考虑使用Web Worker来处理文件读取和图片生成的过程，从而避免阻塞UI线程。