jit-viewer详细介绍

作者：马育民 • • 阅读：10085

介绍

jit-viewer 是国内开源、纯前端离线文档预览SDK，核心特点：无需后端转换服务、文件本地浏览器解析不上传服务器、全格式统一预览、兼容Vue/React/原生JS/Blazor，主打企业系统、网盘、文档管理平台集成Office/PDF/CAD/3D/代码等全品类文件预览。

开源地址

Github：https://github.com/jitOffice/jit-viewer-sdk
Gitee：https://gitee.com/lowcode-china/jit-viewer
在线演示：https://jitword.com/jit-viewer.html

包管理

NPM发布jit-viewer，当前稳定版v1.5.0（2026-04更新）

授权

开源免费商用、无文件数量/预览次数限制，内置版权防盗锁定（私自移除水印/版权会全屏锁定预览）

✅ 优势

  1. 零后端成本：不用部署LibreOffice、PDF转换服务，节省服务器资源；
  2. 数据安全：文件浏览器本地解析，不外发服务器，适合政务、涉密、金融内网；
  3. 格式还原度高：Office复杂表格、公式、排版优于零散JS库；
  4. 按需加载：插件化架构，不用CAD/3D则不加载对应WASM包，减少打包体积；
  5. 全格式统一API：所有文件一套初始化代码，降低多格式集成成本。

❌ 局限性

  1. 超大文件受限：单文件＞500MB CAD/3D文件受浏览器内存限制，建议桌面端打开；
  2. 老旧二进制格式：.doc/.xls/.ppt（非OOXML老格式）部分复杂格式兼容性一般，优先推荐docx/xlsx；
  3. 极端加密PDF：部分高强度加密PDF无法前端解密预览，需后端提前解密文件流。

适用业务场景

  1. 企业OA、文档管理系统、私有网盘；
  2. 国产化项目（OFD国产版式预览刚需）；
  3. 代码仓库、低代码平台在线文件预览；
  4. 工业项目图纸（DXF/3D模型）在线查看；
  5. 内网私有化部署系统（不能出网，禁用第三方云预览）。

原理

传统预览3种痛点：

  • LibreOffice后端转PDF：服务器CPU负载高、格式错位、大文件等待久；
  • 第三方在线预览API：文件外传、隐私泄露、按量计费成本高；
  • 碎片化前端库（mammoth+sheetjs+pdfjs）：多库割裂、PPT兼容极差、集成繁琐。

jit-viewer实现逻辑

浏览器端通过JS+WASM原生解析文件二进制，直接解析docx/xlsx/pptx/OFD/PDF底层OpenXML结构，不靠后端转码；PDF基于pdfjs-dist深度二次封装，CAD/3D靠WASM轻量化解析，文件全程在浏览器内存解析，不会上传云端，满足涉密内网、国产化系统场景。

支持预览格式（全品类覆盖）

1. 办公文档

DOCX/DOC、XLSX/XLS、PPTX/PPT、PDF、OFD(国产版式)、CSV/TSV、TXT、Markdown

2. 代码文件（自动语法高亮）

Java/Python/JS/TS/C#/Go/PHP/CSS/HTML等几十种编程语言，开发平台代码在线预览首选

3. 多媒体

JPG/PNG/GIF等图片、MP4/MP3等音视频（内置自研播放器，可控播放API）

4. 工程图纸&3D模型

  • CAD：DXF原生解析，DWG/DWF通过适配器兼容；
  • 3D：GLB、GLTF、STL三维模型在线旋转缩放预览

支持开发环境

原生HTML、Vue3、React、Blazor、Svelte、Angular全前端框架。

接入方式

原生HTML引入（3行最简代码）

<link rel="stylesheet" href="https://unpkg.com/jit-viewer/dist/iife/jit-viewer.min.css">
<script src="https://unpkg.com/jit-viewer/dist/iife/jit-viewer.min.js">
<div id="viewer" style="width:100%;height:600px"></div>
<script>
const {createViewer}=JitViewer;
createViewer({
  el:'#viewer',
  file:'test.docx',//本地Blob/远程URL/ArrayBuffer均可
  toolbar:true
})
</script>

NPM模块化（Vue/React项目）

npm install jit-viewer

Vue3示例：

import {createViewer} from 'jit-viewer'
import 'jit-viewer/style.css'
createViewer({el:containerDom,file:'xxx.pdf'})

内置功能配置项

  1. UI配置：明暗双主题、中英文国际化、自定义宽高、开关顶部工具栏（缩放/翻页/打印/下载/全屏）；
  2. 水印能力：文字/图片平铺水印、透明度、倾斜角度、层级（顶层/底层），企业版权管控；
  3. 文件源：本地File对象、远程HTTP链接、Blob、ArrayBuffer、自定义请求拦截适配器（适配内网私有存储）；
  4. 生命周期钩子：onReady初始化就绪、onLoad文件渲染完成、onError异常捕获；
  5. 离线能力（V1.5重大升级）：PDF Worker内置打包Blob URL，完全脱离CDN、纯离线部署，内网私有化项目首选。

原文出处：/show_1GW3R47RBap7.html

吉ICP备15003043号