CKEditor Ecosystem Documentation
Search
Home/CKEditor 5/API
Interface

CloudServicesConfig (cloud-services)

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

interface
See source

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

  • bundleVersion : String

    See source

    An optional parameter used for integration with CKEditor Cloud Services when uploading the editor build to cloud services.

    Whenever the editor build or the configuration changes, this parameter should be set to a new, unique value to differentiate the new bundle (build + configuration) from the old ones.

  • connectionTimeout : String

    The timeout (in seconds) for the connection. Defaults to 10.

    If the connection will not be established after the specified number of second passes, the editor will throw an error.

    Raise this value if you are experiencing connection timeout problems.

    ClassicEditor
	.create( {
		cloudServices: {
			connectionTimeout: 20,
			// ...
		}
	} )
	.then( ... )
	.catch( ... );

  • requestTimeout : String

    The timeout (in seconds) for each request send to the Cloud Services. Defaults to 20.

    If the request is not finished after the specified number of second passes, the editor will throw an error.

    Raise this value if you expect that your requests will be big (e.g. mostly concerns the document data and the initial request).

    ClassicEditor
	.create( {
		cloudServices: {
			requestTimeout: 60,
			// ...
		}
	} )
	.then( ... )
	.catch( ... );

  • tokenUrl : String | function

    See source

    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

    See source

    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

    See source

    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.