springboot UEditor集成

1. pom文件中加载ueditor 以及相关的jar包

<dependency>
                <groupId>com.blingblingbang</groupId>
                <artifactId>ueditor</artifactId>
                <version>1.1.2</version>
   </dependency>

2. 下载jsp版本的UEditor,并将UEditor相关的文件放到static目录

3. 在static/UEditor 下找到ueditor.config.js,修改serverUrl: "http://localhost:8088/config"(这个路径是自己写的UEditorController的路径)

4. 编写UEditorController

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.json.JSONException;
import org.springframework.util.ClassUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import com.baidu.ueditor.ActionEnter;

@RestController
public class UEditorController {
    @RequestMapping(value="/config")  
    public void config(HttpServletRequest request, HttpServletResponse response) {  
        response.setContentType("application/json");  
        String rootPath =ClassUtils.getDefaultClassLoader().getResource("").getPath()+"static/UEditor/jsp";
        try { 
            response.setCharacterEncoding("UTF-8");
            String exec = new ActionEnter(request, rootPath).exec();  
            PrintWriter writer = response.getWriter(); 
            writer.write(new org.json.JSONTokener(exec).nextValue().toString());  
            writer.flush();  
            writer.close();  
        } catch (IOException e) {  
            e.printStackTrace();  
        } catch (JSONException e) {
            e.printStackTrace();
        }  
  
    }  
}

5. 修改前端引用到ueditor的文件根据官方文档改写getActionUrl方法

  <script type="text/javascript">
    var ue = UE.getEditor('editor',{
        initialFrameWidth:"100%" //初始化选项
        //scaleEnabled:true//scaleEnabled {Boolean} [默认值:false] //是否可以拉伸长高,默认true(当开启时,自动长高失效)
      }
    );
        UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
        UE.Editor.prototype.getActionUrl = function(action) {
            if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
                return 'http://localhost:8088/uploadimages'; //返回我们实际的上传图片地址
            } else {
                return this._bkGetActionUrl.call(this, action);
            }
        }
  </script>

6. 接下来就是写uploadimages的代码了。

猜你喜欢

转载自www.cnblogs.com/QAZLIU/p/8888740.html
今日推荐