我已经做出承诺,可以在文件上传时解析文件类型。
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。