如果这是重复,我很抱歉.我还没有发现任何与此相关的问题:
新的TinyMCE 4.2图像工具将图像保存为base64数据,而不是目录中的图像文件.
在最新发布的TinyMCE 4.2中,有一个新的内联图像编辑器(Ref:Image Tools)运行良好.但它将图像保存在HTML中作为base64数据:
<img src="data:image/jpeg;base64 (...)">
而不是将图像文件上传到特定文件夹,然后使用常规图像参考/路径.
我必须将它保存为常规文件,否则我在CMS中的另一个页面上出现问题. (无论如何它会好得多).
我试图理解目前存在的小文档,但没有成功. (可能是因为我对javascript不够了解,而且对于了解javascript的人来说这是合乎逻辑的.)
这就是我所做的:
在TinyMCE init中:
plugins: [" (...) imagetools"],
images_upload_handler: function(blobInfo, success, failure) {
console.log(blobInfo.blob());
success('url');
},
images_upload_url: "/tinymce/postAcceptor.php",
参考:http://www.tinymce.com/wiki.php/Configuration:images_upload_handler
http://www.tinymce.com/wiki.php/Configuration:images_upload_url
我的postAcceptor.php是这个的副本(除了正确的路径,IP等):
http://www.tinymce.com/wiki.php/PHP_Upload_Handler
图像工具运行良好.它只是不保存我想要的图像.
以下是图像工具内联的视图:
解决方法:
我的代码,它的工作原理!如果您修改图像并单击确认按钮,则图像工具会自动将新图像上载到服务器.
images_upload_handler: function(blobInfo, success, failure) {
var xhr, formData;
xhr = new XMLHttpRequest();
xhr.withCredentials = false;
xhr.open('POST',
'<%=request.getContextPath()%>/fylerMedia?flyerID=<%=flyerID %>'); <<<<note that you must set your server-side upload hander.
xhr.onload = function() {
var json;
if (xhr.status != 200) {
failure('HTTP Error: ' + xhr.status);
return;
}
json = JSON.parse(xhr.responseText);
success(json[0].url); <<<<<return value, you can change the url of image.
};
formData = new FormData();
formData.append('file', blobInfo.blob(), blobInfo.filename());
xhr.send(formData);
}
希望它能帮到你!