使用文件魔术码的文件类型检查器

时间:2018-11-13 11:39:57

标签: javascript reactjs async-await file-type react-dropzone

我已经做出承诺,可以在文件上传时解析文件类型。

const fileTypeChecker = file => new Promise((resolve) => {
  const fileReader = new FileReader()

  fileReader.onloadend = (e) => {
    const arr = (new Uint8Array(e.target.result)).subarray(0, 4)
    let header = ''
    let type = null
    for (let i = 0; i < arr.length; i++) {
      header += arr[i].toString(16)
    }
    switch (header) {
      case '89504e47': // png
      case 'ffd8ffe0': // following are jpeg magic numbers
      case 'ffd8ffe1':
      case 'ffd8ffe2':
      case 'ffd8ffe3':
      case 'ffd8ffe8':
        type = 'IMG'
        break
      case 'd0cf11e0': // xls
      case '504b34':   // xlsx
        type = 'XLS'
        break
      case '25504446':
        type = 'PDF'
        break
      default:
        type = 'unknown' // Or you can use the blob.type as fallback
        break
    }
    resolve(type)
  }

  fileReader.readAsArrayBuffer(file.slice(0, 4))
})

我正在使用react-dropzone删除文件。 onDrop函数定义为

  onDrop = async (accepted, rejected) => {
    const file = accepted[0] || rejected[0]
    const fileType = await fileTypeChecker(file)
    let error = ''
    if (fileType === 'XLS') {
      this.setState({
        bulkUpload: {
          files: file
        }
      })
    } else {
      error = 'Please select a valid XLS file'
    }
    if (error) {
      this.setState({
        error
      })
    }
  }

为什么.xlsx和.zip文件的文件幻数为504b34? 因此,即使我上传了一个zip文件,也将其视为XLS。

0 个答案:

没有答案