1.通过image插件正常上传的图片可以在回调方法内限制图片大小。
效果:

代码:
tinymce.init({
selector: '#tinydemo',
plugins: 'image paste code link lists table preview save',
toolbar: 'image',
height:500,
language:'zh_CN',
file_picker_types: 'image',
paste_data_images: true,
images_upload_handler: function (blobInfo, success, failure, progress) {
var reader = new FileReader();
var AllowImgFileSize = 2100000; //上传图片最大值(单位字节)( 2 M = 2097152 B )超过2M上传失败
reader.readAsDataURL(blobInfo.blob());
reader.onload = function () {
if (AllowImgFileSize != 0 && AllowImgFileSize < reader.result.length) {
failure("上传失败,请上传不大于2M的图片!");
return;
}else{
//执行上传操作
success(this.result);
alert(reader.result);
}
}
}
});
2.通过paste插件直接粘贴过来的图片。
问题:虽然粘贴来的经过images_upload_handler方法,会有报错信息,但是不能阻止图片上传,依然可以上传成功。
解决方案:
修改paste插件上传文件的代码 路径:tinymce\plugins\paste\plugin.min.js

代码:
return new ge(function (e) {
var t = P(r.getAsFile) ? r.getAsFile() : r, n = new window.FileReader;
var AllowImgFileSize = 2100000; //上传图片最大值(单位字节)( 2 M = 2097152 B )超过2M上传失败
n.onload = function () {
if (AllowImgFileSize != 0 && AllowImgFileSize < n.result.length) {
alert("上传失败,请上传不大于2M的图片!");
return;
}
e({blob: t, uri: n.result})
}, n.readAsDataURL(t)
})
效果:

小提示:
1.如何开启了paste插件,却不能复制粘贴图片的,可能是浏览器不支持,建议用谷歌。
2.更改后,好像限制的是所有上传的文件大小,不仅仅针对于图片。后续有其他个性化需求,可以再自行改造。
版权声明:本文为wx2207原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。