更新记录

1.0.0（2026-09-13） 下载此版本

预览pdf、word、excel、ppt、md、txt等文件，支持所有端

平台兼容性

uni-app(3.8.5)

uni-app x(3.8.5)

其他

预览pdf、word、excel、ppt、md、txt、视频等等文件，支持所有端

功能介绍

• 支持预览pdf、word、excel、ppt、md、txt、视频等文件

• 支持本地文件和云端文件

• 支持uniapp、uniapp-x

• 支持自定义UI

• 支持苹果、安卓、鸿蒙、小程序等等

• 支持 doc, docx, xls, xlsx, xlsm, ppt, pptx, csv, tsv, dotm, xlt, xltm, dot, dotx,xlam, xla ,pages ,pptm 等 Office 办公文档

• 支持 wps, dps, et, ett, wpt 等国产 WPS Office 办公文档

• 支持 odt, ods, ots, odp, otp, six, ott, fodt, fods 等OpenOffice、LibreOffice 办公文档

• 支持 vsd, vsdx 等 Visio 流程图文件

• 支持 wmf, emf 等 Windows 系统图像文件

• 支持 psd ,eps 等 Photoshop 软件模型文件

• 支持 pdf ,ofd, rtf 等文档

• 支持 xmind 软件模型文件

• 支持 bpmn 工作流文件

• 支持 eml, msg 邮件文件

• 支持 epub 图书文档

• 支持 obj, 3ds, stl, ply, gltf, glb, off, 3dm, fbx, dae, wrl, 3mf, ifc, brep, step, iges, fcstd, bim 等 3D 模型文件

• 支持 dwg, dxf, dwf, iges , igs, dwt, dng, ifc, dwfx, stl, cf2, plt 等 CAD 模型文件

• 支持 txt, xml(渲染), xbrl(渲染), md(渲染), java, php, py, js, css 等所有纯文本

• 支持 zip, rar, jar, tar, gzip, 7z 等压缩包

• 支持 jpg, jpeg, png, gif, bmp, ico, jfif, webp ,heic ,heif等图片预览（翻转，缩放，镜像）

• 支持 tif, tiff 图信息模型文件

• 支持 tga 图像格式文件

• 支持 svg 矢量图像格式文件

• 支持 mp3,wav,mp4,flv 等音视频格式文件

• 支持 avi,mov,rm,webm,ts,rm,mkv,mpeg,ogg,mpg,rmvb,wmv,3gp,ts 等视频格式转码预览

• 支持 dcm 等医疗数位影像预览

• 支持 drawio 绘图预览

如需完全本地预览文件，请使用插件https://ext.dcloud.net.cn/plugin?name=wrs-uts-viewfile

预览文件服务部署

服务目前采用docker部署方式

docker pull crpi-ygoqfjyoj0tr8m85.cn-guangzhou.personal.cr.aliyuncs.com/wrsspace/previewfile:1.0.4
docker run --name previewfile --restart always -itd -p 8848:8848 --name previewfile crpi-ygoqfjyoj0tr8m85.cn-guangzhou.personal.cr.aliyuncs.com/wrsspace/previewfile:1.0.4

## 如果是https的域名访问，启动docker的时候加上KK_BASE_URL参数，替换host为https域名，例如：
docker run --name previewfile --restart always -itd -p 8848:8848 -e KK_BASE_URL="https://mymedia.free.idcfengye.com" --name previewfile crpi-ygoqfjyoj0tr8m85.cn-guangzhou.personal.cr.aliyuncs.com/wrsspace/previewfile:1.0.4

服务器启动后，将common/url_help.js代码里的host地址改为这里的地址let host = "http://192.168.2.19:8848"，容器有效期请咨询作者

开发文档

    import {
    getResourcePath
} from "@/uni_modules/wrs-previewfile"

• 获取项目里static文件夹里的文件路径

let url = getResourcePath("/static/utf8.txt")

• 预览文件使用官方的webview

<web-view :webview-styles="webviewStyles" :src="src"
    :style="'width:'+width+'px;height:'+height+'px;'"></web-view>

// 文件路径，注意如果路径里包含中文的时候需要编码正确，最好使用demo的编码接口
let fileUrl = "https://xx.xx.xx/xx.pdf"
// 服务器地址，服务器部署请点击上面"进入交流群"私聊作者
let host = "http://192.168.2.19:8848"

let src = host + "/preview?url=" + encodeURIComponent(Base64.encode(fileUrl))
// 如果需要水印可以加上下面水印参数
src = src + '&watermarkTxt=' + encodeURIComponent("水印")

• 预览本地文件

先调用上传接口上传文件，再采用预览云端文件的方式浏览文件

let host = "http://192.168.2.19:8848"
let uploadFileUrl = host + "/fileMgr/fileUpload"

uni.uploadFile({
    url: uploadFileUrl,
    filePath: path,
    name: 'file', // 固定为file
    success: (uploadFileRes) => {
        let data = uploadFileRes.data
        let isUploadSuc = false
        if (data) {
            let dataObj = JSON.parse(data)
            let code = dataObj.code
            const fileName = filePath.substring(filePath.lastIndexOf('/') + 1);
            if (code == 0) { // 上传成功
                isUploadSuc = true
                let content = dataObj.content

                this.previewFile(fileName)
            } else if (code == 1) { // 存在同名文件，请先删除原有文件再次上传
                isUploadSuc = true
                this.previewFile(fileName)
            }
        }
        if (!isUploadSuc) {
            this.showMsg("文件上传失败：" + JSON.stringify(uploadFileRes))
        }
    },
    fail: (error) => {
        this.showMsg("文件上传失败：" + JSON.stringify(error))
    }
});

• 删除服务器端缓存的文件

let fileName = "https://xx.xx.xx/xx.pdf" // 服务器文件地址
let host = "http://192.168.2.19:8848"
let deleteFileUrl = host + "/fileMgr/deleteFile?fileName=" + encodeStr(getFileUrl(fileName))

uni.request({
    url: deleteFileUrl,
    success: (res) => {
        console.log(res.data);

    }
 });