精确判断文件类型

精确判断文件类型：

前言:

一般上传的文件都要做类型过滤，但是如果手动修改后缀名，就不精准了

比如把一个word文档由.doc改为 .png

将上传文件转为二进制形式后，再获取其前四位头文件的十六进制编码，根据这个就可以精准判定上传文件类型。对于不符合上传格式要求的，直接在客户端做处理。

用法：

import { BinaryByte } from '@/model/common';
function getFileMimeType(file) {
  const map = BinaryByte;
  const reader = new FileReader(); // 异步按字节读取文件内容，结果用ArrayBuffer对象表示
  reader.readAsArrayBuffer(file); // ArrarBuffer代表原始的二进制数据
  return new Promise((resolve, reject) => {
      reader.onload = (event) => {
        try {
            let array = new Uint8Array(event.target.result); 
            array = array.slice(0, 4);
            let arr = [...array]
            // 不同场景将key加入 BinaryByte 中
            let key = arr.map(item => item.toString(16)
                .toUpperCase()
                .padStart(2, '0'))
                .join('')
            resolve(map[key])
        } catch (e) {
            reject(e);
        }
      };
  });
}

export const BinaryByte = {
	"38425053": "psd", 	// Adobe Photoshop
	"41433130": "cad", 	// dwg
	"41564920": "avi",  // AVI
	"47494638": "gif", 	// GIF
	"52617221": "rar",	// RAR Archive
	"57415645": "wave", // Wave
	"FFD8FF": "jpeg",	// JPEG
	"FFD8FFE1": "jpeg",	// JPEG
	"FFD8FFDB": "jpg",	// JPG
	"89504E47": "png",	// PNG
	"49492A00": "tiff",	// TIFF
	"424D": "bmp",		// Windows Bitmap
	"7B5C727466": "rtf",	// Rich Text Format
	"3C3F786D6C": "xml",	// XML
	"68746D6C3E": "html",	// HTML
	"44656C69766572792D646174653A": "eml",	// Email [thorough only]
	"CFAD12FEC5FD746F": "dbx",	// Outlook Express
	"2142444E": "outlook",	// (pst) 
	"D0CF11E0": "xlsordoc",	// MS Word/Excel .xls .doc
	"5374616E64617264204A": "mdb",	// MS Access
	"FF575043": "wordperfect",	// (wpd)
	"252150532D41646F6265": "postscript",	//(eps.or.ps)
	"255044462D312E": "pdf",	// Adobe Acrobat 
	"AC9EBD8F": "quicken",	// qdf
	"25504446": "qdf",	// qdf
	"E3828596": "pwl",	// Windows Password
	"504B0304": "zip",	// ZIP Archive  ps: docx/xlsx 也为 zip
	"2E7261FD": "ram",	// Real Audio
	"2E524D46": "rm",	// Real Media
	"000001B3": "mpeg",	// MPEG
	"6D6F6F76": "mpeg1",	// MPEG1
	"6D6F6F76": "quicktime",	// (mov)
	"3026B2758E66CF11": "asf",	// Windows Media
	"4D546864": "midi",	// mid
	"3D22C3C5": "csv"
};

// 精确 判断文件 类型
const preciseJudge = async (file: any) => {
    const nameList = ['png', 'jpeg', 'jpg'];// 不同场景再换需求的类型
    const isJudge = [] as string[]; // 返回的是上传文件的类型
    // 精确的文件类型
    for (let i = 0; i < file.length; i++) {
        await getFileMimeType(file[i])
            .then(res => {
            isJudge.push(res + '');
        })
            .catch(() => isJudge.push(''));
    }
    const is = isJudge.every(item => nameList.includes(item));
    return is;
};

// 获取 一下 上传文件的所有二进制
const binaryName = await preciseJudge(file);
if (!binaryName) {
    mapData.spinning = false;
    ElMessage.error('上传图片只能是 JPG/JPEG/PNG 格式!');
    return;
}