借助AI,1周,0后端成本,我们开源了一款Office预览SDK

今天给大家分享一款我借助AI, 开发的一款开源 Office 文件预览SDK。

我把它起名叫 jit-Viewer ,刚好和我们做的 JitWord 协同AI文档相呼应。

它主要的功能就是++可以在浏览器中一键预览++ ++Docx,PDF,Excel,PPT,Markdown,Txt++ ++等各种格式的文件++。

同时只需要3行代码,就可以轻松集成到Vue,React,Angular,Html项目中。

话不多说,先上开源地址。

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

核心功能亮点

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

所以我们完全不依赖后端,同时目前支持的文件预览方式有:

  • 本地上传文件

  • 通过url地址直接预览文件

这2种方式基本上是用户需求最多的方式。

总结几个核心亮点,方便大家参考评估:

  1. 零后端依赖,纯前端渲染:无需配置任何后端服务,静态站点也能用

  2. 框架无绑定:一个SDK同时支持Vue/React/Angular,团队技术栈切换无成本

  3. 隐私安全:文件解析在浏览器本地完成,不上传服务器

  4. 性能优异:虚拟滚动 + Web Worker,大文件不卡主线程

  5. 扩展性强:插件化架构,可自定义渲染器、添加水印、集成审批流

这里我在补充一条,目前预览访问不仅能在PC端预览,还能直接在移动端预览:

充分满足大家移动办公的需求。

同时为了提供开发人员对预览的样式控制,我还支持了预览控件:

  • 下载文件

  • 缩放重置

  • 旋转功能

  • 全屏

  • 主题切换

  • 获取文档信息

后续会持续优化一些更可控的功能供大家使用。

如何本地使用

我在 jit-viewer 文档中写了详细的本地使用教程,接下来给大家分享一下。

第一步,引入SDK:

复制代码
<!-- 引入样式文件 --><link rel="stylesheet" href="jit-viewer.min.css"><!-- 引入 JitViewer SDK --><script src="jit-viewer.min.js"></script>

第二步,创建预览容器:

复制代码
<div id="viewer" style="width: 100%; height: 600px;"></div>

第三步,初始化实例:

复制代码
// 创建预览器实例const viewer = JitViewer.createViewer({  file: 'document.pdf',      // 文件 URL  filename: 'document.pdf',  // 文件名(可选)  toolbar: true,             // 显示工具栏  theme: 'light',            // 主题  width: '100%',  height: '600px',  onReady: () => console.log('准备就绪'),  onLoad: () => console.log('加载完成'),  onError: (err) => console.error('错误:', err)});// 挂载到 DOMviewer.mount('#viewer');

是不是非常简单?只需要3步,就能快速集成到你的系统中实现 Office 文件预览功能。

我在文档中也写了详细的API介绍,大家想定制SDK样式和交互,也可以参考文档:

文档地址:++https://jitword.com/jit-viewer.html++

小小总结一下

之所以要做这个项目,完全来自于之前的客户的一个需求,为了给我们的客户赋能,我们便做了这个开源SDK。

后续会继续迭代优化,实现更多文件类型的预览功能,大家有好的建议也欢迎留言区交流反馈~

对于AI,其实并不是全程参与开发(尤其是复杂的业务需求),大家短期内还是不用太神话AI的能力。

对于SDK的工程化方案(脚手架),我是完全交给AI来实现的,同时从文档的编写,网站demo的设计,也都是交给AI做的,到这里,AI基本能代替40%左右的工作了。

我提供的是SDK的产品需求,设计思路,技术选型,和设计风格,同时兼顾测试工程师的角色,这块其实是目前AI人机协作的常态

所以技术能力还是需要,用好AI可能更好的为我们的工作和产品研发提效。

新的竞争力 在于:++架构设计的品味、安全风险的嗅觉、人机协作的智慧,以及++ ++对自己代码的深刻理解++ ++。++

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

相关推荐
云境筑桃源哇2 小时前
AI审核进入全维创新时代:合思如何重构企业合规与效率双壁垒
人工智能·重构
十八画圣2 小时前
企业级AI Agent落地:我们用Openclaw实现了哪些自动化?
运维·人工智能·自动化
Dxy12393102162 小时前
HTML中图表学习:从基础到实战指南
前端·学习·html
We་ct2 小时前
LeetCode 53. 最大子数组和:两种高效解法(动态规划+分治)
前端·算法·leetcode·typescript·动态规划·分治
我爱学习_zwj2 小时前
设计模式-3(装饰器模式)
前端·设计模式·装饰器模式
GIS数据转换器2 小时前
基于GIS的海上航路智能规划系统
网络·人工智能·安全·无人机·旅游
KindSuper_liu2 小时前
OpenClaw接入飞书配置问题
人工智能·飞书
安逸sgr2 小时前
破局与重构:为什么 Agent 需要记忆系统?
人工智能·缓存·重构·github·aigc·agent
SCKJAI2 小时前
token+视程空间重构算力应用新范式
人工智能