欢迎光临
我们一直在努力

Open File Viewer -- 一个前端多文件类型的预览神器

做后台系统的人,迟早都会碰到一个需求:

附件在线预览。

一开始看着很简单,图片直接展示,PDF 接个 pdf.js,文本塞进代码编辑器,视频交给浏览器。

真正麻烦的是后面。

用户开始上传 doc、xls、pptx、wps、et,再混进压缩包、邮件、图纸、代码文件,原本一个小功能,很快就变成一套独立系统。

我自己也被这个问题折腾过很多次。

所以一个文件预览 SDK它来了:

Open File Viewer。

目前已经支持原生 JavaScript、Vue、React、Svelte,Office 方向也覆盖了 doc、docx、xls、xlsx、pptx 等常见格式。

文件预览最难的地方,是失控

很多项目最早的预览代码,大概都是这样:

if (isPdf(file)) {
  openPdf(file);
} else if (isImage(file)) {
  openImage(file);
} else if (isOffice(file)) {
  openOffice(file);
} else {
  download(file);
}

刚开始没问题。

等格式一多,业务就会慢慢失控:

PDF 有一套工具栏
图片有一套缩放逻辑
Office 有一套加载状态
视频有自己的控制器
压缩包只能下载
错误状态各写各的

同一个预览功能,弹窗里写一遍,详情页再写一遍,审批流和附件中心继续复制。

最后项目里没有“文件预览能力”,只有一堆散落的格式判断。

我开发 Open File Viewer,最先解决的就是这个问题:

把所有文件预览统一收口到一个入口。

业务层只负责传文件,剩下

赞(0)
未经允许不得转载:171主机测评 » Open File Viewer -- 一个前端多文件类型的预览神器
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址