Docker集成onlyoffice实现预览功能

1.拉取镜像

docker pull onlyoffice/documentserver

2. 数据卷挂载

mkdir -p app/onlyoffice/DocumentServer/logs

mkdir -p app/onlyoffice/DocumentServer/data

mkdir -p app/onlyoffice/DocumentServer/lib

mkdir -p app/onlyoffice/DocumentServer/db

3.运行容器

docker run -i -t -d -p 8089:80 --restart=always \

-v /app/onlyoffice/DocumentServer/logs:/var/log/onlyoffice \

-v /app/onlyoffice/DocumentServer/data:/var/www/onlyoffice/Data \

-v /app/onlyoffice/DocumentServer/lib:/var/lib/onlyoffice \

-v /app/onlyoffice/DocumentServer/db:/var/lib/postgresql -e JWT_SECRET=my_jwt_secret onlyoffice/documentserver

访问onlyoffice地址:http://服务器ip:8089

4.关闭token认证

onlyoffice7.2版本之后默认开启jwt验证。 所以这里我们需要关闭token认证,不然就会出现如下图所示:

关闭认证:

更改/etc/onlyoffice/documentserver/local.json

docker exec -it [容器id] bin/bash

cd /etc/onlyoffice/documentserver

sed -i 's/true/false/g' local.json

supervisorctl restart all

5.允许私有ip

进入容器内部至/etc/onlyoffice/documentserver/default.json ,修改此配置文件,如下图所示:

然后重启容器:docker restart 容器id。

6.页面预览

html 复制代码
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Title</title>
</head>
<body>
<!-- 注意:121.199.75.131:8089是我部署的ip+端口,这个要换成你的 -->
   <script type="text/javascript" src="http://121.199.75.131:8089/web-apps/apps/api/documents/api.js"></script>
   <button id="previewBtn">预览</button>
   <div id="preview"></div>
   <script type="module">
    console.log('DocsAPI:', DocsAPI);
    const previewBtn = document.getElementById('previewBtn');
    previewBtn.addEventListener('click', () => {
        // 这里我们要预览office
        const config = {
            document: {
                // 文件类型
                fileType: 'xlsx', 
                title: 'exam.xlsx', // 展示的文件名称
                url: 'http://121.199.75.131:5403/images/car_peer.xlsx',// 需要预览的url(这里是我服务器中的一个文件地址)
            },
            editorConfig: {
                // 只读
                mode: 'view',
            }, // 文档类型
            documentType: 'cell', // 预览区域的宽度
            width: '100%', // 预览区域的高度
            height: '700px',
        };
        const docEditor = new DocsAPI.DocEditor('preview', config);
    });
</script>
</body>
</html>

相关推荐
初遇你时动了情21 分钟前
html js 原生实现web组件、web公共组件、template模版插槽
前端·javascript·html
躺着听Jay28 分钟前
Oracle-相关笔记
数据库·笔记·oracle
田梓燊33 分钟前
数学复习笔记 19
笔记·线性代数·机器学习
QQ27402875641 分钟前
Soundness Gitpod 部署教程
linux·运维·服务器·前端·chrome·web3
前端小崔1 小时前
从零开始学习three.js(18):一文详解three.js中的着色器Shader
前端·javascript·学习·3d·webgl·数据可视化·着色器
哎呦你好1 小时前
HTML 表格与div深度解析区别及常见误区
前端·html
运维@小兵1 小时前
vue配置子路由,实现点击左侧菜单,内容区域显示不同的内容
前端·javascript·vue.js
逼子格1 小时前
硬件工程师笔记——二极管Multisim电路仿真实验汇总
笔记·嵌入式硬件·硬件工程师·multisim·硬件工程师学习·电子器件·电路图
龙湾开发2 小时前
计算机图形学编程(使用OpenGL和C++)(第2版)学习笔记 10.增强表面细节(二)法线贴图
c++·笔记·学习·图形渲染·贴图
koiy.cc2 小时前
记录:echarts实现tooltip的某个数据常显和恢复
前端·echarts