jgraph/drawio-nextcloud

What means "real-time collaboration"?

arnowelzel opened this issue · 11 comments

According to the changelog, Draw.io supports real-time collaboration since version 2.0.0.

I expected something as described here - one can see the other users cursors and also every change is transmitted live to all other users: https://www.diagrams.net/doc/faq/share-diagrams

However I tested this and it seems not to work as expected in Nextcloud. When I share a Draw.io file with another use we can both open it at the same time but we don't see each others changes while editing. Only when a user changes something and saves the file, he wil be asked to merge the changes if the other one also change something:

image

When I enable "Activate autosave" then every change is immediately saved, but still the other user will not see the changes. In this case it is even worse: then it can happen, that the file gets locked and the other user can not save anything at all and is asked to export the file to keep his changes.

Is this the intended way of collaboration or am I missing something? Is there any additional server side configuration required?

My enviroment:

  • Nextcloud 25.0.3 self hosted
  • Diagrams.net 20.8.0 running in Docker behind a reverse proxy via HTTPS
  • Draw.io 20.0.2
  • Browsers tested: Vivaldi, Chrome, Firefox (each with the latest version available).

Settings for Draw.io:

Draw.io URL: (my proxy for the Docker container via HTTPS)
Theme: Default, Dark: Auto
Language: auto
Offline mode: no
Autosave: no
Enable libraries: yes
Enable diagram previews: no

Real-time is only available if the online version of diagrams.net is used. I've updated the readme in v2.0.2 to reflect that.

How to use the online version of diagrams.net? What Draw.io URL has to be entered for that in the settings?

When I enter https://app.diagrams.net instead of my own server it says "app.diagrams.net refused the connection" and when I leave the URL empty the status bar displays an error and collaboration does not work either:

image

https://embed.diagrams.net

Clearing the url settings should default to this url, any errors in the browser console?

No, no errors. I can not see any error messages in the browser console and also no requests to https://embed.diagrams.net/ which did not work. Diagram editing itself is ok - just the realtime collaboration does not work. I also cleared the browser cache and tried it with different browsers - no change, sorry.

If you don't mind, can you send me HAR file (Network log) of opening the editor. If information is private you can send to my email
Thanks

You got a mail.

Please try again with autosave on

With autosave on it works - thanks for your support!

Maybe it would be a good idea to have at least some hint in the backend settings about this:

"Please note: realtime collaboration is only possible with Autosave enabled and using the official server from diagrams.net and not with a self hosted server."

Or maybe we have a setting on the top:

Server:

( ) diagrams.net (needed for realtime collaboration)
( ) self hosted - URL [________________]

...

Activate autosave? [Yes]   Note: to enable realtime collaboration, autosave must be active.

Great. I'll add you suggestions in the next version

@m-mohamedin Will this feature be available for self-hosted diagrams.net in the future?

@m-mohamedin Will this feature be available for self-hosted diagrams.net in the future?

Technically it is possible but you'll need to implement cache and websocket servers