JS 获取视频中某一个时间点的图像信息

获取某个时间点的图片信息：
url: 要获取的视频地址
currentTime : 要获取图片的时间点信息
width: 图片的宽度
height : 图片的高度，可不传16/9
Promise：返回图片base64信息

/**
 * @description: 获取某个时间点的图片信息
 * @param {String} url: 视频地址
 * @param {Number} currentTime: 要获取的时间点默认为1
 * @param {Number} width: 生成的图片宽度
 * @param {Number} height: 生成的图片高度
*/
export function getVideoFrameImage(url, currentTime = 1, width = 156, height = 88) {
  return new Promise((resolve, reject) => {
    let video = document.createElement('video')
    video.setAttribute('src', url)
    video.setAttribute('crossOrigin', 'anonymous')
    video.setAttribute('preload', 'metadata')
    // 视频开始可能是黑屏状态
    video.currentTime = currentTime
    video.addEventListener('loadeddata', function () {
      const canvas = document.createElement('canvas')
      canvas.width = width
      canvas.height = width / 16 * 9
      canvas.getContext('2d').drawImage(video, 0, 0, width, width / 16 * 9)
      resolve(canvas.toDataURL('image/jpeg'))
    })
  })
}

效果：