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

相关推荐
lpfasd1232 天前
第2课:Agent系统架构与设计模式
设计模式·系统架构
小鱼儿LY2 天前
软考系统架构设计师之UML统一建模语言
系统架构·软考·uml·架构设计师
alibli2 天前
一文学会CMakeLists.txt: CMake现代C++跨平台工程化实战
开发语言·c++·系统架构
马走日mazouri2 天前
深入理解MySQL主从架构中的Seconds_Behind_Master指标
数据库·分布式·mysql·系统架构·数据库架构
文火冰糖的硅基工坊2 天前
[硬件电路-194]:NPN三极管、MOS-N, IGBT比较
单片机·嵌入式硬件·系统架构·电路
STCNXPARM3 天前
深度剖析Linux内核无线子系统架构
linux·运维·系统架构·wifi·无线子系统
文火冰糖的硅基工坊3 天前
[硬件电路-192]:基级与发射极两端的电压超过1.5v可能是什么原因
单片机·嵌入式硬件·系统架构·电路·跨学科融合
roman_日积跬步-终至千里3 天前
【系统架构设计(28)】计算机系统组成详解:从硬件到软件的解析
系统架构
roman_日积跬步-终至千里3 天前
【系统架构设计(25)】Web应用服务器与现代架构
前端·架构·系统架构
qqxhb3 天前
系统架构设计师备考第20天——信息加解密技术&密钥管理技术
系统架构·des·aes·加解密·rsa·密钥管理·kdc