SpringBoot使用Ckediter上传图片

需求

通过ckediter的自带上传图片的插件,上传图片到我们自己的服务器上。

实现

ckediter的配置部分:找到ckeditor/ckeditor.js。

//后面的地址改为你上传图片的地址
config.filebrowserImageUploadUrl= '/article/uploadImage'

后台Controller部分

@Controller
public class FileUploadController {

    @RequestMapping(value = "article/uploadImage")
    //这里的参数不用改
    public void uplodaImg(@RequestParam("upload") MultipartFile file,HttpServletRequestrequest,  HttpServletResponse response){

            //这是响应的对象(返回的数据对象)
            PrintWriter out = response.getWriter();
            //这个是Ckediter的回调方法,很重要(后边将通过上面的返回对象,返回给前端并触发Ckediter回调)
            String CKEditorFuncNum = request.getParameter("CKEditorFuncNum");


            //这部分是校验图片的后缀(格式)是否正确
            if (uploadContentType.equals("image/pjpeg")
                    || uploadContentType.equals("image/jpeg")) {
                expandedName = ".jpg";
            } else if (uploadContentType.equals("image/png")
                    || uploadContentType.equals("image/x-png")) {
                expandedName = ".png";
            } else if (uploadContentType.equals("image/gif")) {
                expandedName = ".gif";
            } else if (uploadContentType.equals("image/bmp")) {
                expandedName = ".bmp";
            } else {
                out.println("<script type=\"text/javascript\">");
                out.println("window.parent.CKEDITOR.tools.callFunction("
                        + CKEditorFuncNum + ",'',"
                        + "'文件格式不正确(必须为.jpg/.gif/.bmp/.png文件)');");
                out.println("</script>");
                return;
            }


            //这里是校验图片的大小是否允许
            if (file.getSize() > 1024 * 1024 * 2) {
                out.println("<script type=\"text/javascript\">");
                out.println("window.parent.CKEDITOR.tools.callFunction("
                        + CKEditorFuncNum + ",''," + "'文件大小不得大于2M');");
                out.println("</script>");
                return;
            }


            //这里是所有校验成功后的保存操作
            DateFormat df = new SimpleDateFormat(DEFAULT_SUB_FOLDER_FORMAT_AUTO);
            fileName = df.format(new Date()) + expandedName;
            file.transferTo(new File(path + "/" + fileName));

            // 这里是回调的内容:返回"图像"选项卡并显示图片 request.getContextPath()为web项目名  
            out.println("<script type=\"text/javascript\">");
            out.println("window.parent.CKEDITOR.tools.callFunction("
                    + CKEditorFuncNum + ",'" + "../../upload/img/" + fileName
                    + "','')");
            out.println("</script>");
            return;
    }
}

注:上面的代码肯定不能直接粘来用,只是写个大概的逻辑,方便理解。具体实现可以参考这里,点我

posted @ 2017-07-28 17:57  keivnyau  阅读(162)  评论(0编辑  收藏  举报