解决Alist 不能在线预览Office文档问题

逍遥子大表哥

发布于 2025-07-28 19:48:50

1.7K0

文章被收录于专栏：kali blogkali blog

Alist是笔者非常喜欢的一款工具。可以将网盘，本地磁盘进行融合。但是在体验在线文档阅读时，遇到无法预览的情况。由于官方采用微软和谷歌的在线预览服务，由于各种原因无法预览，那又如何解决呢？

我们可以自行搭建相关接口。这里我们OnlyOffice

docker 安装OnlyOffice

#拉取镜像
docker pull registry.cn-chengdu.aliyuncs.com/software-yxl/onlyoffice:7.2
#启动
docker run -it -d -p 8012:80 --restart=always --name onlyoffice registry.cn-chengdu.aliyuncs.com/software-yxl/onlyoffice:7.2

启动容器，访问ip:8012(注意开启防火墙和安全组)

当然，你可以在宝塔面板中，直接新建容器。（不要和已有端口冲突！）

点击管理，配置反向代理和https

访问域名，出现下面界面证明OnlyOffice社区版安装成功。

配置接口

接下来，我们配置接口。点击管理-目录在www/onlyoffice/documentserver-example/welcome目录下，（当然，如果你有其他正在运行的站点，可以放到其他站点的目录下。用当前站点的域名访问这个文件就行了。）新建文件view.html 内容如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>OnlyOffice Viewer</title>
</head>
 
<body>
    <div id="placeholder"></div>
    <script type="text/javascript" src="http://主机IP:8080/web-apps/apps/api/documents/api.js"></script>
    <script>
        function getQueryParamValue(name) {
            const searchParams = new URLSearchParams(window.location.search);
            return searchParams.get(name);
        }
 
        const url = decodeURIComponent(getQueryParamValue("src"));
        const fileName = url.substring(url.lastIndexOf('/') + 1, url.lastIndexOf('?') != -1 ? url.lastIndexOf('?') : url.length);
        const fileExtension = fileName.split('.').pop();
        const docEditor = new DocsAPI.DocEditor("placeholder", {
            "document": {
                "fileType": fileExtension,
                "permissions": {
                    "edit": false,
                    "comment": true,
                    "download": true,
                    "print": true,
                    "fillForms": true,
                },
                "title": fileName,
                "url": url,
            },
            "editorConfig": {
                "lang": "zh-CN",
                "mode": "view",
            },
            "height": "1080px",
            "type": "desktop",
        });
    </script>
</body>
</html>

修改此处为你的IP或域名

完成后，我们就得到了接口地址：https://你的域名/welcome/view.html?src=xxx 其中xxx为在线文档的地址。完整效果如下：

https://office.bbskali.cn/welcome/view.html?src=https://blog.bbskali.cn/usr/uploads/2024/12/3865909025.pptx

配置Alist

点击设置-预览-Iframe 预览 添加修改后的参数。

{
 "doc,docx,xls,xlsx,ppt,pptx": {
  "onlyoffice":"https://office.bbskali.cn/welcome/view.html?src=$e_url",
  "Google":"https://docs.google.com/gview?url=$e_url&embedded=true"
 },
 "pdf": {
  "PDF.js":"https://alist-org.github.io/pdf.js/web/viewer.html?file=$e_url"
 },
 "epub": {
  "EPUB.js":"https://alist-org.github.io/static/epub.js/viewer.html?url=$e_url"
 }
}

注意，部分同学alist是部署在本地的。文档中相关域名改为你的IP地址就行了。除此之外，还有一种方法是通过部署kkfileview接口来实现的。但相对于前者，功能比较单一。当然，部署完成接口后。我们还可以在HTML页面中展示office文档。

<embed src='https://xxxxx/web-apps/view.html?src=https://xxxxx/kali.doc' width='100%' height='400px%' frameborder="0" style="overflow:hidden;">
</embed>

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2024-12-19，如有侵权请联系 cloudcommunity@tencent.com 删除

office