测试onlyoffice在线预览文件功能

HTML示例代码

HTML 复制代码
<!DOCTYPE html>
<html lang="zh">
 
<head>
    <meta charset="UTF-8">
    <title>测试onlyoffice在线预览文件功能</title>
    <script type="text/javascript" src="http://onlyoffice服务器ip:端口/web-apps/apps/api/documents/api.js"></script>
    <style>
        html {
            height: 100%;
            width: 100%;
            padding: 0;
            margin: 0;
        }
        
        body {
            height: 100%;
            width: 100%;
            padding: 0;
            margin: 0;
        }
    </style>
</head>
 
<body class="full-screen">
    <div id="placeholder"></div>
 
    <script language="javascript" type="text/javascript">
        var docEditor = new DocsAPI.DocEditor("placeholder", {
 
            "document": {
                "fileType": "xlsx",
                "title": "xxx.xlsx",
                //地址必须文件服务器能访问到
                "url": "http://ip:端口/static/qms/xxx.xlsx" //文件地址
            },
            });
    </script>
</body>
<style type="text/css">
    .full-screen {
        height: 100%;
        overflow: hidden;
    }
</style>
 
</html>

注意事项

1、http://onlyoffice服务器ip:端口/web-apps/apps/api/documents/api.js能正常访问,访问结果如下

2、文件地址 必须是onlyoffice服务器可以访问到的地址

相关推荐
ftswsfb12 小时前
【系统架构设计师(第2版)】七、系统架构设计基础知识
系统架构
找了一圈尾巴1 天前
架构师备考-架构基本概念
架构·系统架构
白总Server2 天前
OpenHarmony
后端·spring cloud·华为·微服务·ribbon·架构·系统架构
ftswsfb2 天前
【系统架构设计师】六、UML建模与架构文档化
系统架构·uml
程序猿进阶2 天前
系统上云-流量分析和链路分析
java·后端·阿里云·面试·性能优化·系统架构·云计算
ccino .3 天前
企业级邮件系统架构
系统架构
小云小白3 天前
springboot 传统应用程序,适配云原生改造
云原生·系统架构·k8s·springboot
2401_857617625 天前
Spring Boot框架下的信息学科平台系统架构设计
spring boot·后端·系统架构
0_1_bits5 天前
【系统架构】如何演变系统架构:从单体到微服务
微服务·架构·系统架构
后端从入门到精通5 天前
RUP生命周期架构-系统架构师(八十七)
架构·系统架构