测试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服务器可以访问到的地址

相关推荐
m0_587383004 小时前
24 小时自助健身房系统软件开发实战指南与案例解析
java·spring boot·spring·系统架构·需求分析
辛迪聊物业数字化7 小时前
物业管理系统新手部署与实操指南
数据库·物联网·架构·系统架构
启雀AI8 小时前
全球化培训平台多语言多时区引擎技术实现:自动语言探测、语种动态管理与本地化渲染方案
ai·系统架构·软件需求·培训系统·培训平台
带金箍的至尊宝1 天前
系统架构设计师笔记 05:第2章硬件与软件基础,冯诺依曼结构怎么考
数据库·笔记·系统架构
Jmyd01231 天前
智慧文博三维重建系统架构设计:从结构光采集到平台交付全链路
系统架构
各类产品分享11 天前
钢铁厂 AR 设备点检系统架构设计与落地实践
系统架构·ar·ar巡检
HRTOS1 天前
HRTOS 4.0 内核资源配置优化:减少资源对象与消息队列数量
经验分享·单片机·系统架构·51单片机
省钱兄--zs1 天前
24小时自助健身房系统软件开发实战:从架构设计到部署全指南
java·数据仓库·spring boot·系统架构·需求分析
tianyuanwo1 天前
【软考高级系统架构设计师】05 - DevOps & CI/CD专题备考
ci/cd·系统架构·devops
tianyuanwo1 天前
【软考高级系统架构设计师】02 - 架构评估专题备考
系统架构