TinyMce的paste插件,限制粘贴的图片大小

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.更改后，好像限制的是所有上传的文件大小，不仅仅针对于图片。后续有其他个性化需求，可以再自行改造。