nextcloud插件的折腾
errol发表于2023-12-27 08:42:04 | 分类为 系统/软件 | 标签为nextcloud插件

上一篇文章中提到过,在内网中使用nextcloud进行文件分享时,存在生成的链接以内网主机地址开头的问题,导致将链接给其他人使用之前,还得手动修改链接,这显得很麻烦。

针对这一情况,本文为nextcloud开发了一个新的功能,它可以让nextcloud生成“正确的分享链接”,从而免去手动修改的麻烦。

这个新功能,依赖于nextcloud的插件机制:插件机制是nextcloud中的一种重要概念,它提供了插件的运行环境,即安装、运行、卸载,极大地提升了系统的灵活性与可拓展性。

image

图1 nextcloud插件列表

默认情况下,nextcloud已经启用了一些插件,它们具体的表现为系统中的某个模块或部件,如下图中,“文件(files)”是一个插件,仪表盘也是一个插件。

image

图2 文件

image

图3 仪表盘

通常情况下,可以把插件当做平时所接触的模块页面,不过也存在一些不同,比如本次开发的插件。

它的重点并不在于页面展示,而是对现存的插件(files)进行拓展,因此,更准确的来说,它是“插件的插件”。

现在我们知道了,nextcloud有两种类型的插件,一种是以页面展示为主的视觉型插件,另一种是以拓展其他插件为主的功能型插件。

下面开始对本插件的主要功能和机制进行简要说明(仅为前端部分)。

1、插件概览

安装&启用插件后,在files插件加载完成时,指定的js文件中的代码将会被执行,主要有以下两个动作。

1)获取自定义地址

var customUrl = window.sessionStorage.getItem("customUrl");
if (!customUrl) {
    $.ajax({
        url: '/nextcloud/index.php/apps/customizing_download_urls/getUrl',
        method: "GET",
        dataType: "json",
        contentType: "application/json",
        success: function(resp) {
            customUrl = resp.data.url;
            window.sessionStorage.setItem("customUrl", customUrl);
        }
    });
}

2)新增下拉菜单

以下代码通过nextcloud提供的接口向分享菜单注册了一个名为“复制我的自定义链接”的按钮选项,同时绑定了handlers点击事件;触发事件时,会将获取到的地址与原有的分享链接进行拼接,并复制到粘贴板中。

window.addEventListener('DOMContentLoaded', () => {
    if (OCA.Sharing && OCA.Sharing.ExternalShareActions) {
        var _instance;
        OCA.Sharing.ExternalShareActions.registerAction({
            id: "copy my custom url",
            data: function(instance) {
                _instance = instance; // instance是一个vue组件实例;
                return {
                    is: instance.$parent.$children[0].$options.components.NcActionButton, // 引用NcActionButton组件;通过vue内置的component组件渲染(查看nextcloud源码得知)
                    text: "复制我的自定义链接",
                    icon: "icon-external"
                }
            },
            shareType: [3],
            handlers: {
                click: function() {
                    var url = "";
                    if (_instance) {
                        var _share = _instance._props.share._share;
                        // 在分享链接后拼接'/download/文件名'就是完整的下载链接
                        url = _share.url + "/download" + _share.file_target;
                    }
      				_instance.$parent.$parent.$parent.$parent.$parent.$options._parentListeners['update:open'](false);
                    copyHandler(customUrl, url);
                }                
            }
        });
    }
});

3)定义地址

第一步中,获取地址前首先得定义地址。

在浏览器打开下方链接,可看到插件的管理界面。

http://域名/nextcloud/index.php/apps/customizing_download_urls/

image

图4 Customizing Download Urls管理面板

输入后点击保存即可,随后将会通过ajax请求获取该地址。

2、插件运行效果

1)创建分享链接后,可看到下拉菜单中新增的选项

image

图5 新增的选项

2)点击将链接复制到粘贴板

image

图6 复制链接成功

http://g0wg60y8.shenzhuo.vip:60332/nextcloud/index.php/s/xFZ23P9YXBCqnSZ/download/163C595C581D72F9E5BA0D977AC4E144.jpg


以上就是该插件主要功能的说明,有需要的读者可在此处获取插件源码。

虽然插件本身比较简单,但在开发的过程中并不是那么顺利,遇到了不少的坑。

比如对php不熟悉,什么语法、语句都不懂,每一步几乎都需要百度&谷歌,好在nextcloud提供有现成的插件模板,加上涉及到的只是一些比较简单的逻辑语句,比较容易查找得到;

还有就是是相关文档和资料较少,并且很琐碎,虽然官网有一个类似的案例,但它并不能实现自己的需求,只能查看nextcloud前端部分源码,一点点地研究和调试,兜兜转转下来也花了不少的时间。

而且比较难受的是,这种插件只能在web中使用,在其他客户端是不生效的...(其实想想也知道,使用js编写的代码怎么可能会在安卓或其他客户端中生效呢)

这样只能后续再尝试往安卓端中也加入这个功能了。不过话说回来,如果说自己对web还算熟悉的话,那对安卓真可谓是一窍不通。

爬完一座山后,发现前方还有一座更高的山,这就是我此时此刻的感受。

返回