TinyMCE init options
$scope.tinymceOptions = {
plugins: 'base64img image imagetools paste ...',
relative_urls: false,
paste_data_images: true,
...
};
paste_data_images: true
option means that data:url
images (inline images) should NOT be removed from the pasted contents (see docs).
I use TinyMCE 4.2.8. Inside base64img
plugin I've written the following code
var editor; // TinyMCE editor
var imgData; // base64 image data string, like "data:image/png;base64,...="
editor.setContent("<img src='" + imgData + "' />", {format: 'raw'});
// editor.execCommand('mceInsertRawHtml', false, '<img src=\'' + imgData + '\' />'); // another way
to embed an image which is loaded in memory as base64 string. After the command is executed img src is magically converted into 'blob:http%3A//localhost%3A8080/...'
. Why?
It works (images are displayed), but I want to store images as data:
rather than upload them to server and store as blob
. How to change this behaviour?
Add hyperlinks to content. The toolbar button and menu item called link are included in TinyMCE's default configuration. The link menu item can be found in the Insert menu. The link plugin also includes a context menu and context toolbar.
Click the 'Insert/Edit Image' button, then click the 'Upload' tab. Alternatively, drag and drop an image here. All image uploading options are supported, including images_upload_handler (a way to define custom file uploader) and images_upload_credentials .
Image is saved internally as 'data:image/png;base64,...='
, so you don't need to worry. No uploading is performed, 'blob:http%3A//localhost%3A8080/...'
is used for displaying an image info only.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With