在 TinyMCE 中设置数据 URI

Question

TinyMCE 初始化选项

$scope.tinymceOptions = {
    plugins: 'base64img image imagetools paste ...',
    relative_urls: false,
    paste_data_images: true,
    ...
};

paste_data_images: true 选项意味着 data:url 图像（内联图像）不应从粘贴的内容中删除（参见 docs）。
我使用 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

到 embed an image 作为 base64 字符串加载到内存中。命令执行后img src被神奇地转换为'blob:http%3A//localhost%3A8080/...'。 为什么？

有效（显示图像），但我想将图像存储为 data: 而不是将它们上传到服务器并存储为 blob。 如何改变这种行为？

Answer 1

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

在 TinyMCE 中设置数据 URI

Set data URI in TinyMCE

html

tinymce

image