组件库upload组件上传图片/视频前校验类型大小尺寸时长等

// 上传视频前
const beforeUploadVideo = (file) => {
    console.log('限制上传格式与大小', file)
    const videoLimit = file.type.search("mp4") != -1
    const isLt100M = file.size / 1024 / 1024 < 100
    if (!videoLimit) {
        proxy.$message.warning('请检查视频格式')
    }
    if (!isLt100M) {
        proxy.$message.warning('视频大小不能超过100M')
    }
    const timeLimit = new Promise(function (resolve, reject) {
      // 获取视频时长
      let videoUrl = URL.createObjectURL(file)
      let audioElement = new Audio(videoUrl)
      var isLimit = true
      audioElement.addEventListener("loadedmetadata", () => {
          let duration = audioElement.duration // 时长为秒，小数，182.36
          if (duration > 60) {
            isLimit = false
          }
          console.log('限制上传格式与大小', duration, isLimit)
          isLimit ? resolve() : reject()
      })
    }).then(
      () => {
        return file
      },
      () => {
        proxy.$message.warning('视频时长不能超过60s')
        return Promise.reject()
      }
    )
    return videoLimit && isLt100M && timeLimit
}

// 上传图片前校验
const beforeUploadRatioImg = (file) => {
    console.log('限制上传格式与大小', file)
    const imgLimit = file.name.search("png") != -1 || file.name.search("jpg") != -1 || file.name.search("jpeg") != -1
    const isLt5M = file.size / 1024 / 1024 < 5
    if (!imgLimit) {
        proxy.$message.warning('请检查图片格式')
    }
    if (!isLt5M) {
        proxy.$message.warning('图片大小不能超过5M')
    }
    const isSize = new Promise(function (resolve, reject) {
      const width = 375 // 限制图片尺寸
      const height = 500
      const URL = window.URL || window.webkitURL
      const img = new Image()
      img.onload = function () {
        const valid = img.width >= width && img.height >= height
        valid ? resolve() : reject()
      }
      img.src = URL.createObjectURL(file)
    }).then(
      () => {
        return file
      },
      () => {
        proxy.$message.warning('请检查图片宽高，按要求上传')
        return Promise.reject()
      }
    )
    return imgLimit && isLt5M && isSize
}

获取图片高度

// 上传图片成功时触发
const imporFileSuccess = async (currentFile) => {
  var file = {}
  file['uid'] = currentFile.uid
  file['url'] = currentFile.response.data
  file['name'] = currentFile.name
  file['size'] = currentFile.file.size
  // 获取图片宽高
  const img = new Image()
  img.src = URL.createObjectURL(currentFile.file)
  img.onload = await function() {
    console.log('上传图片成功',img.width) // 图片宽度
    console.log('上传图片成功',img.height) // 图片高度
    file['width'] = img.width
    file['height'] = img.height
    URL.revokeObjectURL(img.src) // 释放URL对象引用
    fileList.val.push(file)
    console.log('上传图片成功', currentFile, file, fileList.val)
    completeMounted.value = true
  }
}