Embed image into tinymce with base64 encoding

5
votes

I want to embed an image into the tinymce editor but not the file, I want to embed it with this form (put its base64 data directly) 

<img src="data:image/png;base64,ABCD..."></img>

I store the image data in a variable,

var data= '<img src="data:image/png;base64,ABCD..."></img>';

When I invoke

tinyMCE.execCommand('mceInsertContent', false, data);

or

tinyMCE.execCommand('mceInsertRawHTML', false, data);

or

tinyMCE.activeEditor.setContent(data, {format:'raw'});

after invoking, when I get the HTML back, we have:

<img src="blob:XYZ">

but the blob content is not same as the data we provide, it is very short and we can not see the image if we reuse this HTML in another browser. TinyMCE uses this BLOB:.. for caching, but I do not want any caching.

1
javascripthtmltinymceembed
It you use TinyMCE APIs to get content back out of the editor it should be the original Base64 version ... is that not what you get when you submit the form that contains the TinyMCE content? – Michael Fromin
Thanks, we found the problem, when we get the content we used getConent ({raw}) variation which caused base64 data to be convertd to blobs. If we called getContent(), we get the base64 data. – benchpresser

1 Answers

4
votes

try to setup this confifguration

tinymce.init({
  paste_data_images: true
});

https://www.tiny.cloud/docs/plugins/paste/#paste_data_images