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

相关推荐
考拉讲支付3 小时前
延迟分账 / 核销分账的技术实现方案:服务完成后再分钱,到底怎么设计?
大数据·运维·人工智能·微信小程序·小程序·系统架构
ai_coder_ai6 小时前
多 Agent 智能应用系统架构设计
系统架构
画中有画10 小时前
RAG 检索增强生成系统架构设计与应用
系统架构
昵称画10 小时前
图文:一张十年前的车间系统架构图
低代码·系统架构·php·企业微信·rxjava·零售
RockHopper202511 小时前
传统工业制造功能软件体系中的语义断裂
系统架构·智能制造·isa-95
排得官方11 小时前
私域电商系统架构解析:排得甄选如何实现“购物返佣+排队券”双引擎驱动?
系统架构·技术实现·私域电商架构·排队引擎·返佣系统·一级绑定
Jmyd01231 天前
文博数字化教学系统架构解析:从三维采集到虚拟展厅的实现路径
系统架构
辛迪聊物业数字化1 天前
物业费收缴率从68%提升到97%落地复盘:中小物业收费系统选型避坑指南
人工智能·嵌入式硬件·物联网·网络协议·系统架构
zhongben123_1 天前
从零开发一个打车APP:技术选型、系统架构与成本评估指南
大数据·运维·ios·系统架构·uni-app·web app
代钦塔拉1 天前
【C++/Qt 进阶】设计模式系列(7):过滤器模式——把“筛选条件“变成可组合的积木
数据库·系统架构