个别用户电脑上传某些格式视频无法预览/播放
场景:某些电脑用户上传同一视频,却发现无法预览/播放该视频,如mov/f4v/vob/rm/rmvb...等格式
原因:使用同一个文件上传出现通过获取到的file对象type属性为"",系统中所安装的Microsoft Excel软件或注册表的原因,不常见的文件扩展名会返回空字符串,最好不要依靠这个type属性作为唯一的验证方案
方法:用file.type做匹配同时用file.name,把常见的type文件后缀name做个配对
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 | var fileTypeList = { docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document" , doc: "application/msword" , pdf: "application/pdf" , rtf: "application/rtf" , xls: "application/vnd.ms-excel" , xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" , ppt: "application/vnd.ms-powerpoint" , pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation" , rar: "application/x-rar-compressed" , swf: "application/x-shockwave-flash" , zip: "application/zip" , mid: "audio/midi" , midi: "audio/midi" , kar: "audio/midi" , mp3: "audio/mpeg" , ogg: "audio/ogg" , m4a: "audio/x-m4a" , ra: "audio/x-realaudio" , gif: "image/gif" , jpeg: "image/jpeg" , jpg: "image/jpeg" , png: "image/png" , tif: "image/tiff" , tiff: "image/tiff" , wbmp: "image/vnd.wap.wbmp" , ico: "image/x-icon" , jng: "image/x-jng" , bmp: "image/x-ms-bmp" , svg: "image/svg+xml" , svgz: "image/svg+xml" , webp: "image/webp" , css: "text/css" , html: "text/html" , htm: "text/html" , shtml: "text/html" , txt: "text/plain" , css: "text/css" , xml: "text/xml" , "3gpp" : "video/3gpp" , "3gp" : "video/3gpp" , mp4: "video/mp4" , mpeg: "video/mpeg" , mpg: "video/mpeg" , mov: "video/quicktime" , webm: "video/webm" , flv: "video/x-flv" , m4v: "video/x-m4v" , wmv: "video/x-ms-wmv" , avi: "video/x-msvideo" , } |
1 2 3 | export function fileTypeFormat(file){ return file.type || fileTypeList[file.name.substring(file.name.lastIndexOf( '.' ) + 1)] } |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!