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

相关推荐
三桥君12 小时前
在AI应用中Prompt撰写重要却难掌握,‘理解模型与行业知识是关键’:提升迫在眉睫
人工智能·ai·系统架构·prompt·产品经理·三桥君
帅次3 天前
系统分析师-计算机系统-输入输出系统
人工智能·分布式·深度学习·神经网络·架构·系统架构·硬件架构
蝸牛ちゃん3 天前
云计算三大服务模式深度解析:IaaS、PaaS、SaaS
云原生·系统架构·云计算·软考高级·saas·paas·iaas
帅次3 天前
系统分析师-计算机系统-计算机系统概述&存储系统
系统架构·硬件架构·软件构建·个人开发·代码规范·设计规范
蝸牛ちゃん3 天前
系统性能评估方法深度解析:从经典到现代
架构·系统架构·软考高级·性能·性能评估
马特说3 天前
Unity VR手术模拟系统架构分析与数据流设计
unity·系统架构·vr
Mr_Xuhhh3 天前
QWidget的属性
java·数据库·c++·qt·系统架构
Baihai IDP4 天前
AI 系统架构的演进:LLM → RAG → AI Workflow → AI Agent
人工智能·ai·系统架构·llm·agent·rag·白海科技
大咖分享课4 天前
如何设计一个登录管理系统:单点登录系统架构设计
系统架构·sso·登录系统
慧一居士4 天前
web 系统对接飞书三方登录完整步骤实战使用示例
架构·系统架构