kindeditor 上传图片后端成功了，web显示上传失败 ,已解决

别人是什么都懂，然后写上代码教大家怎么做，而我只是一个被自己蠢哭的啥都不会的yang

今天我就来告诉大家，被自己蠢哭是啥意思

• springboot实现图片上传，我以前不知道原来是有kindeditor这个html在线编辑器
  大概长这样，这只是部分截图啊，红圈那个就是多图片上传的按钮
  
• 尽然有这个，那就引入被
  http://kindeditor.net/demo.php

要在页面实现上面的样子，首先你要在XXXX.html里面引入textare俗称富文本编辑，代码如下：

 <div class="form-group">
      <textarea id="editor" style="width: 100%; height: 650px;"
       th:utext="${info!=null and info.DetailContent !=null}?${info.DetailContent}: ''"></textarea>
 </div>

然后就是在upFile.js中这样写

KindEditor.ready(function(K){
     

        editor = K.create("textarea[id='editor']",{
     

            resizeType : 1,

            allowPreviewEmoticons: false,

            allowImageUpload:true,//允许上传图片

            allowFileManager:true, //允许对上传图片进行管理

            uploadJson:  '/admin/upload/file', //上传图片的java代码

            fileManagerJson: '/admin/upload/file',

            afterUpload: function(){
     this.sync();}, //图片上传后，将上传内容同步到textarea中

            afterBlur: function(){
     this.sync();},   失去焦点时，将上传内容同步到textarea中

            items : [

                'fontname','fontsize', '|','forecolor', 'hilitecolor','bold', 'italic','underline',

                'removeformat','|', 'justifyleft','justifycenter', 'justifyright','insertorderedlist',

                'insertunorderedlist','|', 'emoticons','link','media','|','multiimage', 'table', 'baidumap'],
            filePostName:'file'

        });
}）

然后就是controller.java了

 @PostMapping({
     "/upload/file"})
    @ResponseBody
    public ApiResult upload(HttpServletRequest httpServletRequest, @RequestParam("file") MultipartFile file) throws URISyntaxException {
     
        String fileName = file.getOriginalFilename();
        String suffixName = fileName.substring(fileName.lastIndexOf("."));
        //生成文件名称通用方法
        SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd_HHmmss");
        Random r = new Random();
        StringBuilder tempName = new StringBuilder();
        tempName.append(sdf.format(new Date())).append(r.nextInt(100)).append(suffixName);
        String newFileName = tempName.toString();
        File fileDirectory = new File(Constants.FILE_UPLOAD_DIC);
        //创建文件，这里Costants是一个常量配置的java文件，FILE_UPLOAD_DIC是自定义地址eg:'D:\\upload\\'
        File destFile = new File(Constants.FILE_UPLOAD_DIC + newFileName);
        try {
     
            if (!fileDirectory.exists()) {
     
                fileDirectory.getParentFile().mkdir();
                if (!fileDirectory.mkdir()) {
     
                    throw new IOException("文件夹创建失败,路径为：" + fileDirectory);
                }
            }
            file.transferTo(destFile);
            //这里是json格式的东西，你也可以返回一个实体，网上方法挺多的
            ApiResult resultSuccess = ResultGenerator.genSuccessResult();
            resultSuccess.setData(JrunningUtils.getHost(new URI(httpServletRequest.getRequestURL() + "")) + "/api/public/images/" + newFileName);
            System.out.println("图片上传成功");
            return resultSuccess;
        } catch (IOException e) {
     
            e.printStackTrace();
            return ResultGenerator.genFailResult("文件上传失败");
        }
    }

• 然后就是启动项目了
  
  问题解决来了
  点完开始上传。然后就成这样了
  
  一看后端控制台，sout输出的“图片上传成功”也在啊。
  看了一下kindEditor-all.js
  
  看了我的ResultGenerator.genFailResult返回的json没有err啊
  然后我就改成这样了
  
  再启动，我mmp，一天了终于出来了
  
  

心情美美哒，然后CSDN记录一下