javascript - 使用文件幻数的文件类型检查器

Question

我已经创建了一个承诺来解决文件上传时的文件类型。

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。