DC娱乐网

开源推荐!jit-viewer让浏览器直接访问Office,3行代码搞定预览

大家好,我是徐小夕。架构师,曾任职多家上市公司,多年架构经验,打造过上亿用户规模的产品,目前全职创业,主要聚集于“Doo

大家好,我是徐小夕。架构师,曾任职多家上市公司,多年架构经验,打造过上亿用户规模的产品,目前全职创业,主要聚集于“Dooring AI零代码搭建平台”和“flowmixAI多模态办公软件”

上期和大家分享了我们精心打磨的协同AI文档 JitWord:

昨天我们发布了 jitword 2.5 版,实现了高精度的Word解析和编辑能力。

最近我们团队为了满足更多开发者的需求,实现了一款能直接在浏览器中预览Office文件(word, pdf, ppt, excel, markdown, txt)的SDK——jit-viewer。

什么是 jit-viewer

它是一个纯前端文件预览SDK,支持 Word、Excel、PPT、PDF 四大主流格式(当然我们也支持了Markdown, TXT格式的预览),同时对 Vue/React/Angular/Svelte 全框架兼容,无需后端转换,浏览器能直接渲染。

大家可以把这个 sdk 轻松集成到任何系统,并实现文件的一键预览,目前项目已开源:

github:https://github.com/jitOffice/jit-viewer-sdk

而且,我们对SDK的设计做到了极致,只需要3行代码,就能轻松集成到任何系统。为什么我们需要它?传统方案的三大痛点

我们做企业级应用时,文件预览往往是"看起来简单,做起来很要命", 一般有如下几个方案:

1. 后端转换方案(如LibreOffice + PDF.js)

服务器压力大:并发一上来,CPU直接飙满格式失真:复杂排版、公式、表格经常"面目全非"延迟感人:大文件等个5-10秒是常态

2. 第三方云服务(如某钉、某微文档接口)

数据外泄风险:敏感文件传到第三方服务器定制受限:UI风格、交互逻辑无法自主控制成本不可控:按调用量收费,业务量上来就是无底洞

3. 纯前端方案(如mammoth.js + SheetJS)

各自为战:Word一个库、Excel一个库,API风格不统一兼容性差:PPT预览基本空白,复杂格式支持弱集成成本高:每个库都要单独学习、配置、踩坑jit-viewer 的实现思路

"浏览器原生能力 + 统一抽象层"

我们不依赖后端转换,而是直接在浏览器端解析 Office Open XML 格式(.docx/.xlsx/.pptx 的底层结构),最后通过 jit-viewer 封装的渲染器渲染成可视化组件。PDF 则基于 Mozilla 的 PDF.js 做深度优化。

结果:

✅ 零后端依赖,纯前端部署✅ 秒级渲染,大文件不卡顿✅ 格式还原度 95%+(包括表格、图片、基础样式)✅ 三行代码集成,API 统一应用场景

jit-viewer 可以应用在如下场景:

场景

痛点

jit-viewer 解法

企业OA系统

合同、公文在线审批,敏感文件不能外传

纯前端渲染,数据不出域

在线教育

课件预览,需要保留PPT动画效果

原生PPT解析,动画还原

SaaS文档管理

多租户场景,预览成本随用户量暴涨

零后端算力消耗,成本可控

移动端H5

微信/钉钉内打开Office文件体验差

自适应渲染,手势操作适配

低代码平台

需要统一的文件预览组件

多框架适配,即插即用

优点客观分析

基于我们研究的一些真实场景和痛点,这里我总结一下它的亮点:真正的纯前端:无需配置任何后端服务,静态站点也能用框架无绑定:一个SDK同时支持Vue/React/Angular,团队技术栈切换无成本隐私安全:文件解析在浏览器本地完成,不上传服务器性能优异:虚拟滚动 + Web Worker,大文件不卡主线程扩展性强:插件化架构,可自定义渲染器、添加水印、集成审批流

下面聊聊大家比较关注的如何集成使用的问题。

从零集成 jit-viewer

我在 jit-viewer 文档中写了详细的使用教程,并提供了完整的API,下面给大家分享一下:

没错,就只需要上面的3步,就能轻松把sdk集成到项目。

如果大家想看详细的文档演示和API介绍,可以参考我们的线上文档。

后续我们会持续迭代和维护这个项目,大家如果觉得有帮助,欢迎给个小小的 star ~

github:https://github.com/jitOffice/jit-viewer-sdk

开源不易,你的支持是我们最大的动力。