关于wangeditor自定义上传图片

自定义上传图片

        var E = window.wangEditor;
            var editor = new E('#contentDiv')           
            editor.customConfig.customUploadImg = function(files, insert) {
                // files 是 input 中选中的文件列表
                // insert 是获取图片 url 后，插入到编辑器的方法             
                console.log("changeTitleImg")           
                var formData = new FormData();
                formData.append('file', files[0])
                let reader = new FileReader();
                reader.readAsDataURL(files[0]);
                reader.onload = function(e) {
                    let img = new Image();
                    img.src = e.target.result; //获取编码后的值
                    img.onload = function() {
                        console.log('height:' + img.height + '----width:' + img.width)
                        let scale = img.width / img.height //这里是获取图片的宽高比,因为我需要在后台压缩图片使用
                        formData.append('scale', scale)
                        console.log(formData.get("scale"));
                        $.ajax({
                            url: httpUrl + 'imgDoc/uploadEdtImg',
                            type: 'POST',
                            data: formData,
                            cache: false,
                            contentType: false,
                            processData: false,
                            success: function(res) {
                                if (200 == res.code) {
                                    console.log(res);
                                    $('.w-e-text')[0].focus();
                                    insert(res.data)
                                } else {
                                    alert("上传失败！")
                                }
                            },
                            error: function() {
                                $("#result").html("与服务器通信发生错误");
                            }
                        });

                    }
                }


            }
            editor.create();

获取编辑器img标签及src属性

    $('#btn2').click(function() {
                alert(editor.txt.html()); // 读取 html
                let imgReg = /|\/>)/gi //匹配图片中的img标签
                let srcReg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i // 匹配图片中的src
                let str = editor.txt.html()
                let arr = str.match(imgReg) //筛选出所有的img
                let srcArr = []
                for (let i = 0; i < arr.length; i++) {
                    let src = arr[i].match(srcReg)
                    // 获取图片地址
                    console.log(src)
                    srcArr.push(src[1])
                }
                
                let saveImg=JSON.stringify(srcArr)
                console.log(saveImg);
                $.ajax({
                    url: httpUrl + "imgDoc/delImg",
                    type: "post",
                    dataType: "json",
                    data:{
                        saveImg:saveImg
                    } ,
                    success: function(rel) {
                        if (rel.code == '200') {
                        
                        }
                    },
                    error: function(xhr, textStatus, errorThrown) {}
                });
                
            });