allfile‑preview|一款适配局域网,开箱即用的前端统一文件预览方案

在内网、局域网业务系统开发中,文件预览一直是非常头疼的痛点。

很多现有预览组件依赖构建工具、需要引入一堆零散依赖库;在内网离线环境下,CDN资源无法加载,组件直接失效;file://本地协议下浏览器安全策略限制fetch请求,本地文档打不开;PDF、Word、Excel、图片、音视频需要分别引入不同预览库,各套组件API不一致,接入繁琐,私有化部署要处理大量静态资源,维护成本居高不下。

allfile‑preview,开源UMD免构建文件预览插件,专门解决内网局域网场景下的各类文件预览难题,一个文件搞定全类型文档预览能力。

✨核心亮点

📦 UMD单文件,免构建,零打包依赖

直接通过script标签引入allfile‑preview.umd.cjs即可使用,不需要Vite、Webpack等构建工具。pdf.js、docx‑preview、SheetJS全部内置内联,不需要额外下载多个JS库。

局域网/离线私有化部署,只需要分发这一个文件,没有外部CDN依赖,断网环境照样工作。

🔐完美兼容file://本地协议,突破浏览器安全限制

很多预览库在本地双击打开html(file://协议)直接报错,浏览器禁止fetch读取本地文件。

allfile‑preview做了适配:选择本机文件后自动转为blob URL,全部解析运算在浏览器本地完成,不上传服务器,本地双击页面也能正常预览PDF、TXT、DOCX、XLSX文档;HTTP/局域网地址环境可直接传入内网资源URL预览文件。

📑多格式统一预览

一套组件覆盖绝大多数常见格式:

  • 文档:PDF、TXT、DOCX、XLSX
  • 多媒体:图片、视频、音频
    一套统一调用方式,不用为不同文件格式维护多套预览逻辑,极大减少业务代码量。

🏭高度适配内网/局域网业务场景

非常适合OA系统、内网文档管理、局域网网盘、本地工具页面、私有化项目:

  1. 离线环境,无外网访问,不依赖外部网络资源
  2. 不想搭建后端转码服务,全部前端浏览器本地解析
  3. 快速原型页面、内网小工具,不想搭建工程化构建环境,直接html+script引入即用
  4. 保护文件隐私,文件数据不会上传第三方服务,全部在前端浏览器处理

🚀快速上手

只需要一行script标签引入,无需npm install,无需构建编译:

复制代码
<script src="./allfile-preview.umd.cjs"></script>

引入完成即可调用预览能力,双击本地HTML文件(file://协议)就能体验完整预览;部署内网web服务,填入局域网资源地址即可在线预览内网文档。

在线演示地址:https://allfile-preview.softinstall.top/

开源仓库(欢迎Star、Issue、PR):https://github.com/ankeji/allfile-preview

🎯适合谁?

  • 前端开发者:内网项目、私有化系统,需要文档预览又不想维护后端转码服务
  • 工具开发者:写本地HTML小工具,希望双击打开就能预览各类本地文件
  • 企业内网系统:OA、档案、文档管理平台,追求离线可用、少依赖、易部署
  • 不想引入重型预览组件,追求单文件、轻量、开箱即用的开发者

以往做内网文件预览,要么搭建复杂的后端文档转码服务,要么引入一堆碎片化预览库,还要处理file://协议各种浏览器限制。现在使用 allfile‑preview,一个UMD文件,就把这些痛点全部抹平,本地、局域网环境都可以稳定实现统一文件预览。

开源项目欢迎大家试用反馈,如果对你有帮助,欢迎前往GitHub点Star支持项目持续迭代。


如果你需要,我可以再帮你输出简短掘金版本(适合发布社区) 、朋友圈/技术群短宣传文案两个版本。

相关推荐
曹牧1 小时前
Spring MVC : Controller 层URL划分
java·运维·服务器·前端
njsgcs2 小时前
safari局域网读电脑地址,第一次读的到,重载之后就不行,得重启。.local解决办法
前端·电脑·safari
Lank_M2 小时前
超分分块为什么按后端分:160与96的取舍
前端
流星。。方2 小时前
企业官网前端组件怎么拆?从落地页到内容页的分层思路
前端
deli0072 小时前
豹纹和斑马纹是怎么长出来的:调两个参数,花纹自己浮现
前端
进击的明明2 小时前
TypeScript速通笔记(上)
前端·面试·typescript
deli0072 小时前
萤火虫为什么会一起闪:调一个耦合系数,整片林子自己同步
前端
计算机魔术师2 小时前
英伟达联合超100家伙伴推出开放代理安全平台
前端
看谷秀2 小时前
arkts-12 鸿蒙生态/卡片
前端·arkts