转-tinyMCE中图片的自定义上传

tinyMCE图片拖动到编辑框或者使用图片上传插件插入到编辑框时，需要指定上传方法，现需要使用后台接收前台上传的图片并将图片保存到服务器，之后将图片的url返回到前台做图片链接。

tinyMCE中有两种方式：

1、直接使用images_upload_url属性，该属性会在上传图片时自动访问指定的url并获取返回地址：

images_upload_url: ‘/image/upload‘,

后台需要返回{ "location": "" }，指向图片url

2、使用images_upload_handler及file_picker_callback，前者用于拖动图片到编辑框中，后者用于文件选择器选择图片上传

images_upload_handler: function(blobInfo, success, failure) {
            var form = new FormData();
            form.append(‘files‘, blobInfo.blob(), blobInfo.filename());
            $.ajax({
                    url: "/image/upload",
                    type: "post",
                    data: form,
                    processData: false,
                    contentType: false,
                    success: function(data) {
                        success(data.location);
                    },
                    error: function(e) {
                        alert("图片上传失败");
                    }
                });
         },

file_picker_callback: function(callback, value, meta) {

            var input = document.createElement(‘input‘);
            input.setAttribute(‘type‘, ‘file‘);
            input.onchange = function() {
                var file = this.files[0];
                var form = new FormData();
                form.append("files", file); 
                $.ajax({
                    url: "/image/upload",
                    type: "post",
                    data: form,
                    processData: false,
                    contentType: false,
                    success: function(data) {
                        callback(data.location);
                    },
                    error: function(e) {
                        alert("图片上传失败");
                    }
                });
            };

            input.click();

        }

 form.append(‘files‘, blobInfo.blob(), blobInfo.filename());及form.append("files", file); 对应的注释为：

formData.append(name, value);
formData.append(name, value, filename);
若不需要filename,可以只传前面两个。 
————————————————
版权声明：本文为CSDN博主「ouxiaoyang5」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/ouxiaoyang5/article/details/81295579