How To One-way Process Html Data For The View In Ckeditor 5?

In the CKEditor view for authors I need to change links to files so that the session ID of the author gets attached. However in the actual content for normal users the specific use

Solution 1:

To modify downloaded links you can write a custom downcast converter, which modifies obtained href. Here is a working sample which adds the current timestamp to URLs: https://codepen.io/msamsel/pen/zVMvZN?editors=1010

editor.conversion.for( 'dataDowncast' ).add( dispatcher => {
    dispatcher.on(
        'attribute:linkHref',
        ( evt, data, conversionApi ) => {
            if ( !conversionApi.consumable.test( data.item, 'attribute:linkHref' ) ) {
                return;
            }

            if ( data.attributeNewValue ) {
                data.attributeNewValue += `#time=${ ( newDate() ).getTime() }`;
            }
        },
        { priority: 'high' }
    );
} );

Few words how it works. There is created listener which reacts on attribute:linkHref changes (it's fired only when data are obtained anyway because it's dataDowncast). Listeners fires with 'high' priority to change URL before the actual Link plugin will create an output. First is checked if the given model element is not consumed, but without consuming it, because we want to preserve native behavior which will process this same element again. The attribute value is extended with a timestamp, what finish this listener. After that, the native behaviour is fired, which has 'normal' priority.

A similar approach was used to implement custom link attributes. More about dispatcher and conversion process might be found here:

• https://ckeditor.com/docs/ckeditor5/latest/framework/guides/architecture/editing-engine.html#conversion
• https://ckeditor.com/docs/ckeditor5/latest/api/module_engine_conversion_downcastdispatcher-DowncastDispatcher.html