在TinyMCE中设置数据URI

naX*_*aXa 13 html5 tinymce image

TinyMCE init选项

$scope.tinymceOptions = {
    plugins: 'base64img image imagetools paste ...',
    relative_urls: false,
    paste_data_images: true,
    ...
};
Run Code Online (Sandbox Code Playgroud)

paste_data_images: true选项意味着data:url不应从粘贴的内容中删除图像(内嵌图像)(请参阅文档).
我使用TinyMCE 4.2.8.base64img我在内部插件中编写了以下代码

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
Run Code Online (Sandbox Code Playgroud)

嵌入一个图像,其在存储器中为base64串加载.执行命令后,img src被神奇地转换为'blob:http%3A//localhost%3A8080/...'.为什么?

它工作(图像显示),但我想存储图像data:而不是上传到服务器和存储为blob.如何改变这种行为?

naX*_*aXa 7

图像在内部保存'data:image/png;base64,...=',因此您无需担心.不执行上传,'blob:http%3A//localhost%3A8080/...'仅用于显示图像信息.