How can I use a different image response?

Question:

Froala WYSIWYG Editor is expecting to get an image response like this { "link": "path/to/image.jpg" }. For technical reasons, I cannot return the response this way. Is it possible to have the editor use a different image response?

Answer:

The image.uploaded event is being triggered as soon as there is a response from the server. You could use the response parameter of this event together with the image.insert method to add the image in the editor.

Also, it is important to return false at the end of the callback to prevent the default editor upload chain.

Below is a code snippet for that:

new FroalaEditor('.selector', {
  events: {
    'image.uploaded': function (response) {
    // Parse response to get image url.
    var img_url = ... ;
    
 // Insert image.
    editor.image.insert(img_url, false, null, editor.image.get(), response);

 return false;
  });