Alist配合kkfileview,解决office文件不能在线预览的问题

由于部署onlyoffice比较麻烦,redis,mq。。。
kkfileview部署简单,而且使用方便,支持的文件类型也超多,探索了以下集成方案:

仓库地址:

https://github.com/kekingcn/kkFileView

通过docker安装

docker pull keking/kkfileview
docker run -dit -p 8012:8012 keking/kkfileview

(docker) alist v3 (直接拉取官方镜像)
(docker) nginx latest (官方镜像)
启动和部署我就不讲啦,有很多大佬都说了。

假设服务端域名为:

kkfileview : kk.share

具体步骤

1.首先给kkfileview服务端的域名kk.share做好反向代理:(此处假设配置好ssl)

# 给kkfile服务代理
location / {
    proxy_pass http://xxx; #此处填入你的服务ip和端口,如http://172.21.0.6:8012
    # 跨域访问
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Headers' '*';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' '*';
}

# 给提供预览服务的view.html页面提供反向代理
location /view.html {
    root /usr/share/nginx/html/kkview;
    index view.html;
}

2.接着在nginx容器内的/usr/share/nginx/html/kkview目录下创建view.html

需要将kk.share替换成你自己提供服务的地址

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>KKFileViewer</title>
</head>

<body>
    <script type="text/javascript" src="https://kk.share/js/base64.min.js"></script>
    <script>
    function getQueryParamValue(name) {
        const searchParams = new URLSearchParams(window.location.search);
        return searchParams.get(name);
    }

    const url = decodeURIComponent(getQueryParamValue("url")); //要预览文件的访问地址
    if (url === "null") {
        console.log("url的参数为空!")
    } else {
        window.open('https://kk.share/onlinePreview?url='+encodeURIComponent(Base64.encode(url)),'_self');
    }
    </script>
    <p>请在输入的网址中添加url参数,如http://kk.share/view.html?url=xxx</p>
</body>
</html>

3.然后在alist的iframe的预览配置中填入以下内容,并保存:

"doc,docx,..."此处可以自己添加预览类型

{
  "doc,docx,xls,xlsx,ppt,pptx,pdf": { 
    "KKFileView": "https://kk.share/view.html?url=$e_durl"
  }
}

然后尝试预览文件。


原文链接:https://github.com/alist-org/alist/discussions/3908