ueditor 单图片上传后提示上传错误,本地已经上传到项目文件夹下,但无法展示

前端的js异步方法无法正常的执行下去,修改ueditor.all.js,大概在24568行

// domUtils.on(iframe, 'load', callback);
// form.action = utils.formatUrl(imageActionUrl + (imageActionUrl.indexOf('?') == -1 ? '?':'&') + params);
// form.submit();

换成下面代码

var formdata = new FormData(form);
var xhr= new XMLHttpRequest();
xhr.open("POST", me.getOpt('serverUrl')+'?action=uploadimage', true);
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4)
        if ((xhr.status >=200 && xhr.status < 300) || xhr.status == 304)
            alert(xhr.responseText);
}
xhr.send(formdata);

xhr.onreadystatechange = function () {
    if(xhr.readyState == 4) {
        console.log(xhr.responseText);
        var json = JSON.parse(xhr.responseText);
        // alert(response.state);
        if (json.state == 'SUCCESS' && json.url) {
            loader = me.document.getElementById(loadingId);
            loader.setAttribute('src', json.url);
            loader.setAttribute('_src', json.url);
            loader.setAttribute('title', json.title || '');
            loader.setAttribute('alt', json.original || '');
            loader.removeAttribute('id');
            domUtils.removeClasses(loader, 'loadingclass');
        } else {
            showErrorLoader && showErrorLoader(json.state);
        }
    }
}

另外再附上后端的上传图片的接口

    @RequestMapping("/ueditor")
    @ResponseBody
    public Object test(HttpServletRequest request,
                       @RequestParam(value = "action") String action,
                       @RequestParam(value = "upfile", required = false) MultipartFile file) throws Exception {
        switch (action) {
            case "config": // 加载返回ueditor配置文件conf/config.json
                return ResourceUtils.getConfig();
            case "uploadimage": // 上传图片
                String state = "SUCCESS";
                String uploadHttpUrl = fileUpload(file);
                return resultMap(file, state, uploadHttpUrl);
            case "uploadvideo": // 上传视频
                String state2 = "SUCCESS";
                String uploadHttpUrl2 = fileUpload(file);
                return resultMap(file, state2, uploadHttpUrl2);
            case "uploadfile": // 上传文件
                String state3 = "SUCCESS";
                String uploadHttpUrl3 = fileUpload(file);
                return resultMap(file, state3, uploadHttpUrl3);
            default:
                return "无效action";
        }
    }

    private Map<String, Object> resultMap(MultipartFile file, String state, String uploadHttpUrl) {
        Map<String, Object> resMap = new HashMap<String, Object>();
        resMap.put("state", state);  //"SUCCESS" 表示成功
        resMap.put("title", file.getOriginalFilename());
        resMap.put("original", file.getOriginalFilename());
        resMap.put("type", file.getContentType());
        resMap.put("size", file.getSize());
        resMap.put("url", uploadHttpUrl);
        return resMap;
    }
 
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值