@ckeditor/ckeditor5-cloud-services

What is @ckeditor/ckeditor5-cloud-services?

@ckeditor/ckeditor5-cloud-services is a package that provides cloud-based services for CKEditor 5, including real-time collaboration, image upload, and automatic save. It allows developers to integrate these features into their CKEditor 5 instances with ease.

What are @ckeditor/ckeditor5-cloud-services's main functionalities?

Real-time Collaboration

This feature allows multiple users to collaborate on the same document in real-time. The code sample demonstrates how to initialize CKEditor 5 with cloud services for real-time collaboration.

const ClassicEditor = require('@ckeditor/ckeditor5-editor-classic/src/classiceditor');
const CloudServices = require('@ckeditor/ckeditor5-cloud-services/src/cloudservices');

ClassicEditor.create(document.querySelector('#editor'), {
  cloudServices: {
    tokenUrl: 'https://example.com/cs-token-endpoint',
    uploadUrl: 'https://your-organization-id.cke-cs.com/easyimage/upload/'
  }
}).then(editor => {
  console.log('Editor was initialized', editor);
}).catch(error => {
  console.error(error.stack);
});

Image Upload

This feature allows users to upload images to the cloud directly from the editor. The code sample shows how to configure the editor to use cloud services for image uploads.

const ClassicEditor = require('@ckeditor/ckeditor5-editor-classic/src/classiceditor');
const CloudServices = require('@ckeditor/ckeditor5-cloud-services/src/cloudservices');

ClassicEditor.create(document.querySelector('#editor'), {
  cloudServices: {
    tokenUrl: 'https://example.com/cs-token-endpoint',
    uploadUrl: 'https://your-organization-id.cke-cs.com/easyimage/upload/'
  }
}).then(editor => {
  console.log('Editor was initialized', editor);
}).catch(error => {
  console.error(error.stack);
});

Automatic Save

This feature enables automatic saving of the document content to the server. The code sample demonstrates how to set up automatic save functionality using cloud services.

const ClassicEditor = require('@ckeditor/ckeditor5-editor-classic/src/classiceditor');
const CloudServices = require('@ckeditor/ckeditor5-cloud-services/src/cloudservices');

ClassicEditor.create(document.querySelector('#editor'), {
  cloudServices: {
    tokenUrl: 'https://example.com/cs-token-endpoint',
    uploadUrl: 'https://your-organization-id.cke-cs.com/easyimage/upload/'
  },
  autosave: {
    save(editor) {
      return saveData(editor.getData());
    }
  }
}).then(editor => {
  console.log('Editor was initialized', editor);
}).catch(error => {
  console.error(error.stack);
});

function saveData(data) {
  // Save data to your server
  console.log('Saving data', data);
}

Other packages similar to @ckeditor/ckeditor5-cloud-services

quill

Quill is a modern WYSIWYG editor built for compatibility and extensibility. It offers a similar real-time collaboration feature through third-party services like Pusher or Firebase. However, it does not provide built-in cloud services for image upload or automatic save.

tinymce

TinyMCE is a popular rich text editor that offers a wide range of plugins for additional functionalities, including image upload and real-time collaboration. Unlike @ckeditor/ckeditor5-cloud-services, TinyMCE requires separate configuration and third-party services for real-time collaboration.

prosemirror

ProseMirror is a toolkit for building rich text editors with a focus on extensibility and customizability. It provides the building blocks for real-time collaboration and image upload but requires more manual setup compared to the out-of-the-box solutions provided by @ckeditor/ckeditor5-cloud-services.

README

CKEditor 5's Cloud Services integration

CKEditor 5's Cloud Services integration layer, which handles config.cloudServices and tokens.

Installation

This plugin is part of the ckeditor5 package. Install the whole package to use it.

npm install ckeditor5

Create free account

If you want to check full CKEditor 5 capabilities, sign up for a free non-commitment 14-day trial.

Documentation

See the @ckeditor/ckeditor5-cloud-services package page in CKEditor 5 documentation.

License

Licensed under a dual-license model, this software is available under:

• the GNU General Public License Version 2 or later,
• or commercial license terms from CKSource Holding sp. z o.o.

For more information, see: https://ckeditor.com/legal/ckeditor-licensing-options.

Changelog

44.1.0 (December 16, 2024)

We are pleased to announce the latest CKEditor 5 release, focusing on performance enhancements and key bug fixes to improve your editing and collaboration experience.

Release Highlights

⚡ Performance enhancements: Part 3

This release introduces another set of performance related improvements, focused on faster editor initialization for huge documents. The initialization time was lowered by further 15% to 45%, depending on the tested sample.

The combined improvements introduced in recent releases amount to around 65%-80% lower loading time in total, which means the editor will load 3-5x faster. As the gain is not linear, bigger documents see even better improvement (more than 10x faster).

Moreover, all these improvements positively impact document save time (editor.getData()), which should help with autosave issues, among others.

We still actively work in this area, so you may expect even more editor load and save efficiency improvements in the upcoming releases.

🔨 Bug Fixes and improvements

• Comments enhancements:
  • Data export options: We introduced the showCommentHighlights option in editor.getData(), that changes the comment marker conversion, allowing for styling comments in the output. Perfect for showing what was commented in Export to PDF, for example.
  • Inline mode improvements: We addressed a problem where comment annotations in inline mode did not close properly when clicking elsewhere in the content.
  • Thread management: We resolved an issue where creating a new thread was not interrupted when the corresponding marker was removed from the content, ensuring better stability during collaborative editing.
• Revision History update:
  • Restore functionality: We disabled the ability to restore the current (edited, not saved) revision, as it represents current content, so there is nothing to restore. At the same time, using it led to some non-obvious behaviors.
• Image handling: We resolved an issue where images in the uploading state could be deleted when dragged and dropped within the editor. Keep dragging, even when it is not there 🙈.

🎄 Happy holidays!

As the holiday season approaches, we extend our warmest wishes to our community and users. Thank you for your continued support, and we look forward to bringing you further enhancements and exciting features in the coming year.