Interface

CloudServicesConfig (cloud-services)

@ckeditor/ckeditor5-cloud-services/src/cloudservices

interface

The configuration for all plugins using CKEditor Cloud Services.

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        cloudServices: {
            tokenUrl: 'https://example.com/cs-token-endpoint',
            uploadUrl: 'https://your-organization-id.cke-cs.com/easyimage/upload/'
        }
    } )
    .then( ... )
    .catch( ... );

See all editor options.

Filtering

Properties

  • documentId : String

    Document ID, used by the RealTimeCollaborativeEditing plugin. All editor instances created with the same document ID will collaborate. It means that each document needs a different document ID if you do not want to start collaboration between these documents. The ID is usually a primary key of the document in the database, but you are free to provide whatever identifier fits your scenario.

    Note: Unlike most plugins, RealTimeCollaborativeEditing is not included in any CKEditor 5 build and needs to be installed manually. Check Collaboration overview for more details.

  • tokenUrl : String | function

    A token URL or a token request function.

    As a string, it should be a URL to the security token endpoint in your application. The role of this endpoint is to securely authorize the end users of your application to use CKEditor Cloud Services only if they should have access e.g. to upload files with Easy Image or to use the Collaboration service.

    ClassicEditor
        .create( document.querySelector( '#editor' ), {
            cloudServices: {
                tokenUrl: 'https://example.com/cs-token-endpoint',
                ...
            }
        } )
        .then( ... )
        .catch( ... );

    As a function, it should provide a promise to the token value, so you can highly customize the token and provide your token URL endpoint. By using this approach you can set your own headers for the request.

    ClassicEditor
        .create( document.querySelector( '#editor' ), {
            cloudServices: {
                tokenUrl: () => new Promise( ( resolve, reject ) => {
                    const xhr = new XMLHttpRequest();
    
                    xhr.open( 'GET', 'https://example.com/cs-token-endpoint' );
    
                    xhr.addEventListener( 'load', () => {
                        const statusCode = xhr.status;
                        const xhrResponse = xhr.response;
    
                        if ( statusCode < 200 || statusCode > 299 ) {
                            return reject( new Error( 'Cannot download new token!' ) );
                        }
    
                        return resolve( xhrResponse );
                    } );
    
                    xhr.addEventListener( 'error', () => reject( new Error( 'Network Error' ) ) );
                    xhr.addEventListener( 'abort', () => reject( new Error( 'Abort' ) ) );
    
                    xhr.setRequestHeader( customHeader, customValue );
    
                    xhr.send();
                } ),
                ...
            }
        } )

    You can find more information about token endpoints in the Cloud Services - Quick start and Cloud Services - Token endpoint documentation.

    Without a properly working token endpoint (token URL) CKEditor plugins will not be able to connect to CKEditor Cloud Services.

  • uploadUrl : String

    The endpoint URL for CKEditor Cloud Services uploads. This option must be set for Easy Image to work correctly.

    The upload URL is unique for each customer and can be found in the CKEditor Ecosystem customer dashboard after subscribing to the Easy Image service. To learn how to start using Easy Image, check the Easy Image - Quick start documentation.

    Note: Make sure to also set the tokenUrl configuration option.

  • webSocketUrl : String

    The URL for web socket communication, used by the RealTimeCollaborativeEditing plugin. Every customer (organization in the CKEditor Ecosystem dashboard) has their own, unique URLs to communicate with CKEditor Cloud Services. The URL can be found in the CKEditor Ecosystem customer dashboard.

    Note: Unlike most plugins, RealTimeCollaborativeEditing is not included in any CKEditor 5 build and needs to be installed manually. Check Collaboration overview for more details.