How we integrated with ownCloud and Nextcloud: pitfalls and their overcoming / ONLYOFFICE Blog

Once one of our users wrote that ONLYOFFICE and ownCloud is a marriage made in heaven (sorry, the original was match made in heaven) and it is strange that no one had thought of filing a plug-in yet. We figured and thought that he was right. Moreover, we love to integrate! In terms of that, of course, we want our editors to be used always, everywhere and wherever convenient.

In general, we ourselves made an application for integrating our document editors with our ownCloud (and then Nextcloud) and in this article we will talk a little about it. There were no insurmountable obstacles on our way, but some difficulties arose and we will share with you the experience of overcoming them. Firstly, it may be useful to you, and secondly, we can no longer keep it to ourselves! That is, for a long time they did not write anything to the blog.

Creating an application is simple, making it work with ownCloud - no

So, the integration application, it’s a connector, it’s our sweetheart is just a bridge between the ownCloud document management web service and our Document Server (Document server, our editors, in general). ownCloud graciously provides an API for writing and embedding applications in our workspace, and we took advantage of this.

In creating the application, the official documentation of ownCloud helped us a lot , and it also interfered . After completing the steps indicated there, we got a ready-made application template. It was simple, but further difficulties began. The internal API is documented, to put it mildly, not too detailed.

For example, to save a file, we needed to get authorization as a specific user. To perform an authorization action, you need to execute certain commands: which commands? Where to find them? How to fulfill them? What do you think the documentation says about this? The correct answer is: nothing.

Creative method

The difficulties of undocumentation began at the very first stage. To create a binding to ownCloud on one server and our Document Server on another and organize data exchange between them, you must first specify the web address of the Document Server. This address is stored in the database for the application and then used when opening the editor or converting documents.

In general, we need to specify the address, but where? Where will we point him? First, we need the ONLYOFFICE settings page in the ownCloud admin panel, but for some reason it didn’t appear there by itself (although we really wanted to). In general, this page needs to be written somehow.

Here other applications for openCloud's ownCloud came to the rescue. I had to peek at how they coped with this task. Specifically, the official ownCloud Antivirus App for files application helped us with the settings page .

Here's what and where we added, guided by the experience of the developers of this application:

/appinfo/app.php

App::registerAdmin("onlyoffice", "settings")

/settings.php

User::checkAdminUser();
return new Application() -> getContainer() -> query("\OCA\Onlyoffice\Controller\SettingsController") -> index() -> render();

/controller/settingscontroller.php

class SettingsController extends Controller {
    private $config;
    public function __construct($AppName, IRequest $request, AppConfig $config) {
        parent::__construct($AppName, $request);
        $this->config = $config;
    }
    public function index() {
        $data = ["documentserver" => $this->config->GetDocumentServerUrl()];
        return new TemplateResponse($this->appName, "settings", $data, "blank");
    }
}

Information on how to access the file system is in the documentation , but in order to learn how to get the file content via the link, we needed to study the official Gallery application .

Here's how we did it:

/lib/downloadresponse.php

class DownloadResponse extends Response {
    private $content;
    public function __construct(File $file) {
        $this->setStatus(Http::STATUS_OK);
        $this->content = $file->getContent();
        $this->addHeader("Content-type", $file->getMimeType() . "; charset=utf-8");
        $this->addHeader("Content-Disposition", "attachment; filename*=UTF-8''" . rawurlencode($file->getName()) . "; filename=\"" . rawurlencode($file->getName()) . "\"");
    }
    public function render() {
        return $this->content;
    }
}

We learned how to add our action to the menu for creating a new file and to the file context menu using the official Text Editor application .

This is how the file is created:

/js/main.js

OCA.Onlyoffice.NewFileMenu = {
    attach: function (menu) {
        if (menu.fileList.id !== "files") { return; }
        menu.addMenuEntry({
            id: "onlyofficeDocx",
            displayName: t(OCA.Onlyoffice.AppName, "Document"),
            iconClass: "icon-onlyoffice-new-docx",
            fileType: "docx",
            actionHandler: function (name) { OCA.Onlyoffice.CreateFile(name + ".docx", menu.fileList); }
        });
    }
};
OC.Plugins.register("OCA.Files.NewFileMenu", OCA.Onlyoffice.NewFileMenu);

And here is how it opens in ONLYOFFICE:

OCA.Onlyoffice.FileList = {
    attach: function (fileList) {
        if (fileList.id == "trashbin") { return; }
        $.each(OCA.Onlyoffice.mimes, function (ext, attr) {
            fileList.fileActions.registerAction({
                name: "onlyofficeOpen",
                displayName: t(OCA.Onlyoffice.AppName, "Open in ONLYOFFICE"),
                mime: attr.mime,
                permissions: OC.PERMISSION_READ,
                icon: function () { return OC.imagePath(OCA.Onlyoffice.AppName, "btn-edit"); },
                actionHandler: function (fileName, context) { OCA.Onlyoffice.FileClick(fileName, context, attr); }
            });
        });
    }
};
OC.Plugins.register("OCA.Files.FileList", OCA.Onlyoffice.FileList);

So, we are great - the Open in ONLYOFFICE action appeared in the context menu of files and the ability to create a new file: a document, a table or a presentation (file creation is implemented on the server as copying to the specified folder with the specified name of the prepared OOXML format file - docx, xlsx, pptx) .

Additional format information

ONLYOFFICE editors work with the following formats (but in different ways): DOCX, XLSX, PPTX, PPSX, TXT, CSV, ODT, ODS, ODP, DOC, XLS, PPT, PPS, EPUB, RTF, MHT, HTML, XPS, PDF DJVU.

When choosing an action for ODT, ODS, ODP, DOC, XLS, PPT, PPS, EPUB, RTF, MHT, the HTML file will first be sent for conversion to the appropriate OOXML format. For DOCX, XLSX, PPTX, PPSX, TXT, a new tab with an editor will open, and for CSV, XPS, PDF, DJVU, a tab with an editor in viewing mode.

Now about Nextcloud

As soon as we informed the world that we were working with our ownCloud, the world immediately demanded that we work with Nextcloud too. We considered these requirements to be fair, but the rally did not start working in this system.

Here are the difficulties that arose:

1. Going icons (of course, correcting styles is not a problem).
2. Nextcloud added Content Security Policy (an inline editor initialization script needed to be signed).
3. New requirements for the Settings page.

It was because of the third point that we thought for a while that we would have to make two separate applications for related systems. Here's how it was - to implement the new interface in NextCloud, you had to register our class of settings in the application description:

/appinfo/inxo.xml

OCA\Onlyoffice\Controller\SettingsController

And then in the class implement the required interface ISettings:

/controller/settingscontroller.php

class SettingsController extends Controller implements ISettings {
    public function getForm() {
        return $this-index();
    }
    public function getSection() {
        return "server";
    }
    public function getPriority() {
        return 50;
    }
...

But here we have a small problem. Bumping into this line, ownCloud crashed, since there is no ISettings interface in its environment:

class SettingsController extends Controller implements ISettings

I had to do everything in a tricky way: make the implementation of the ISettings interface in a separate class, leaving the layout for our ownCloud and Nextcloud layout unified.

/appinfo/inxo.xml

OCA\Onlyoffice\AdminSettings

/lib/adminsettings.php

class AdminSettings implements ISettings {
    public function getForm() {
        $app = new Application();
        $container = $app->getContainer();
        $response = $container->query("\OCA\Onlyoffice\Controller\SettingsController")->index();
        return $response;
    }
    public function getSection() {
        return "server";
    }
    public function getPriority() {
        return 50;
    }
}

Thus, the settings page for ownCloud is connected according to the old algorithm, and for Nexcloud - according to the new one. By the way, there were initiative guys who brought fork from our application and dopped to Nextcloud on their own. They wrote on the forums that this works, and we naturally became interested in how everything was done there. But they did not find a solution to the problem with the settings and did everything in their own way.

What happened?

We got an application that allows you to work with documents using ONLYOFFICE editors in the interface of popular ownCloud and NextCloud. Officially, both companies collaborate with Collabora, but, as you know, not everyone succeeds in deploying it, and there is no full-fledged joint editing there. In addition, we have chosen different formats as the main ones, and if you like “X” more, then ONLYOFFICE is designed specifically for them. Using the connector, you can connect your ownCloud or NextCloud to both the free version of Community and Enterprise.

Detailed instructions in our documentation .

PS If you delve into the documentation, you can also find plugins for Confluence and Alfresco. The latter was originally written not by us, but in a fit of inspiration we recently brought it to mind, what if it comes in handy? In the near future, we will also please you with interesting integrations, undo in quick joint editing and some other important and good news. Stay with us!