前端实现文件预览img、docx、xlsx、ppt、pdf、md、txt、audio、video

前言最近有接到一个需求，要求前端支持上传制定后缀文件，且支持页面预览，上传简单，那么预览该怎么实现呢，尤其是不同类型的文件预览方案，那么下面就我这个需求的实现，分不同情况来讲解一下👇具体的预览需求： 预览需要支持的文件类型有：png、jpg、jpeg、docx、xlsx、ppt、pdf、md、txt、audio、video，另外对于不同文档还需要有定位的功能。例如：pdf 定位到页码，txt和markdown定位到文字并滚动到指定的位置，音视频定位到具体的时间等等。⚠️ 补充：我的需求是需要先将文件上传到后台，然后我拿到url地址去展示，对于markdown和txt的文件需要先用fetch获取，其他的展示则直接使用url链接就可以。不同文件的实现方式不同，下面分类讲解，总共分为以下几类：自有标签文件：png、jpg、jpeg、audio、video纯文字的文件：markdown & txtoffice 类型的文 ………………………………