Docker Libreoffice Online

admin 11/22/2021
47 Comments

In this Blog Post I will explain how you can integrate the LibreOffice Online Editor into your Web Application.

In my example I will use a very simple approach just to demonstrate how thinks are working. I will not show how you integrate the editor with a iFrame into your web application because I assume that if you plan to integrate LibreOffice Online into your own application you are familiar with all the web development stuff.

Dockerized LibreOffice online based on Debian w/ Zabbix Monitoring - tiredofit/docker-libreoffice-online.

Online
  • Collabora, which offers LibreOffice servers to cloud companies, also supports LibreOffice Online server instances for Debian, Ubuntu, CentOS, openSUSE, Univention Virtual Machines, and Docker images.
  • Asked: 2017-04-02 21:14:55 +0200 Seen: 4,954 times Last updated: Sep 28 '20.
  • Collabora Online is a powerful LibreOffice-based online office suite with collaborative editing, which supports all major document, spreadsheet and presentation file formats and works in all modern browsers. Stop and remove the Collabora Online docker image: docker stop CONTAINERID docker rm CONTAINERID start the new image.

So let’s started….

Docker

LibreOffice Online is available as a Docker image. I strongly recommand to run it with Docker and docker-compose during development as things become more easy.

The Docker image is provided by LibreOffice and by Collabora. Collabora is the community mainly developing the LibreOffice Online code. You can get the collabora docker image from here. Another powerful Docker image for LibreOffice Online can be found on Github here.

General information about the Docker Image from Collabora and an integration guide can be found here:

A simple setup just to start the LibreOffice Online with a docker-compose.yaml file will look like this :

Start the stack with :

You will not see much, because you need a so called WOPI Host to view and edit office documents. But for a first test, just to see if you container is running you can call the so called ‘discovery’ endpoint:

This URL will show you the endpoints we will use later to open a document

Also the capabilities endpoint can be useful:

This URL shows you the version and the installed features of your LibreOffice Online instance.

And finally you can open the Admin Interface with the URL:

For that URL you need the admin password you have defined in your docker-compose.yaml file:

Now to get the Editor integrated into your Web Application as you can see in the first screenshot above you need to implement a Rest Service based on the WOPI API. This rest service is usually part of your Web Application. This service is also called the ‘WOPI Host’

The WOPI Host

The WOPI Host is a Rest Service base on the WOPI API. This API is not restricted to LibreOffice, it is also useable for Microsoft Office 365 – But I think we should continue with LibreOffice …

Note: The Collabora API can be found here.

So what you need is an implementation of a WOPI Host. As explained this service will be part of your own web application. The main function is to provide the documents to be edited and a method to store the result from the editor. For that you need three different endpoints:

CheckFileInfo – GET /wopi/files/{name}
This endpoint returns a JSON object providing information about the file {name}. It will be called by LibreOffice Online to know what kind of document will be shown in the edtior

GetFile – GET /wopi/files/{name}/contents
This endpoint provides the raw data of the file and is called by LibreOffice Online to open the file.

PutFile – POST /wopi/files/{name}/contents
This endpoint is called by LibreOffice Online when the user what save the file. After you have received the file content you can store it within your application. The POST request expects the same JSON object as in the CheckFileInfo GET request.

So you can say, the WOPI Host implementation is your service managing the files to be shown and stored within you application.

Jax-rs Example Implementation

Libreoffice Online Docker Tutorial

Docker Libreoffice Online

I will show you here a very very simple example implementation base on the Java Jax-rs API. It is not necessary to implement it in java, but I will give you an idea how your service implementation should be working.

Starting Both Services….

If you have implemented your WOPI Host and build your own Docker image, you can now use docker-compose to start bot – the LibreOffice instance and your WOPI Host. Your docker-compose.yaml file can look like this:

Note we are running two services – wopi-app on port 8080 and LibreOffice on 9980. LibreOffice must be able to access the wopi-app. This access is done internally via the docker private network with the hostname ‘wopi-app’ with is the name of our service.

The Integration

To integrate LibreOffice with your application you need to construct a URL with two parts. The first part is the LibreOffice URL as provided in the discovery service explained above. The second part is pointing to your WOPI Host including the file to be opened:

LibreOffice will first fetch the file infos and than loading the file. So you will see to requests against your WOPI Host Service.

The Editor Form

To open the Editor you need finally to define the following HTML Page. This page is necessary to load a file from your WOPI Host. You can later place this into an iFrame for a smooth integration into your own web application:

Docker Libreoffice Online Download

What we are doing here is the following:

We provide a simple Web Form with an action url starting with the endpoint of your LibreOffice instance (part I. of the URL) and the URL param ‘WOPISrc’ pointing to the WOPI Host implementation (part II. of the URL). Don’t ask why you can’t open the URL form your browser URL. You need the web form to get the editor started (this takes me one day to figure it out).

So that’s it! You should now be able to edit your files in the web browser using LibreOffice!

Security

LibreOffice is not responsible for security. This is all part of your WOPI Host. Typically you will add a Query Param named ‘access_token’ to your access URL. LibreOffice will send the token to your WOP Host. In this way you can secure the calls. This is also important as you can not protect the WOPI Host Rest API endpoint. It must be accessible without any authentication. It is a common practice to work with a custom access_token generated by your we application. For example you can generate a JWT which is a common format to combine a random token with a payload.

Configuration

There is a lot of fine tuning possible with the collabora implementation. The most important part is the file

You can access this file via ssh from your running docker container. The file is well documented. You can tweak it and than replace your custom version running the container. For example you can set the log level from ‘warning’ to ‘debug’ which will give you much more insights what’s happening within the LibreOffice container. But you can also change the language support an other things.

Using PostMessage to interact with LibreOffice Online

You can interact with the LibreOffice Online editor form your web application using PostMessages. This way, you have a fine grained controll about the editor and all events send by the editor during runtime. The integration is based on the Web Messaging protocol, also known as PostMessage.

To enable the communication via Post Messages it is important that your application sends the ‘Host_PostmessageReady’ notification the first time the LibreOffice editor was full initialized. For that you need to register a event listenr and wait for the message ‘App_LoadingStatus’ with the status ‘Document_Loaded’.

See the following Example Script:

Find more details about the Post Message in Collaboara here.

Inserting a Custom Button

For example to insert a new button you can send the following PostMessage (after send ‘Host_PostmessageReady’):

It is not easy to figure out the existing button IDs. I only found this source code file which can give you some hints.

Conclusion

LibreOffice Online provides an extremely powerful and flexible full open source web editor for all kinds of Office documents. The integration is not trivial but it is worth to do it.

If you have any questions or ideas, just leave a comment!

With LibreOffice Online you can edit office documents in your browser. You need a workingLibreOffice Online server. More info on https://www.libreoffice.org/download/libreoffice-online/

For LibreOffice Online to work you need to setup SSL and allow your Group-Office URL to use it.In case you need some guidance on how to set it up we wrote a blog post on how to setupLibreOffice Online here:

Install the Office Online module from the Business package at System Settings -> Modules.

Docker run libreoffice/online

Reload Group-Office and go to System Settings -> Office Online.

Then add your LibreOffice Online Service. The default port for LibreOffice online is 9980. BUt with the reverse proxy setupabove we’re using the standard SSL port so it’s not necessary to specify it.

Now every user can go to the files module and use it. Just right click a file and choose “Open with…”.

Note

If you get a 404 error when editing because /wopi is not found then you probably are missing the alias in yourwebserver configuration. The Group-Office Debian and Docker packages automatically create this but with the tarballpackage you have to do this manually.Example configuration can be found here.