ueditor 编辑器,自定义图片上传

 1 <div>  
 2     <h1>完整demo</h1>  
 3     <form method="post" name="form">  
 4     <div id="editor" name="content"  style="800px;height:500px"></div>  
 5      
 6       <div id="editor2" name="content"  style="800px;height:500px"></div>  
 7          
 8     </form>  
 9 </div>  
10 <div><input type="button" value="提交" onclick="t()"></input></div>  
11   
12 三、创建ue对象实例  
13 <script type="text/javascript">  
14   
15     //实例化编辑器  
16     //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例  
17     var ue = UE.getEditor('editor',{  
18         toolbars: [  
19                    ['source','subscript','superscript', 'undo', 'redo', 'bold', 'snapscreen','preview', 'simpleupload','insertimage', 'emotion',   
20                     'spechars',   'drafts' , 'time','date']  
21                ],  
22                autoHeightEnabled: true,  
23                autoFloatEnabled: true,  
24                imageActionName:'testUpload'//定义上传的action名称  
25            });  
26   
27     UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;  
28     UE.Editor.prototype.getActionUrl = function(action) {  
29         if (action == 'testUpload') {//跳转到后来的上传action  
30             return '${pageContext.request.contextPath}/testEditor/testUpload.action';  
31         } else {  
32             return this._bkGetActionUrl.call(this, action);  
33         }  
34     }  
35       
36    
37     function t(){  
38         form.action="${pageContext.request.contextPath }/testEditor/testForm.action";  
39         form.submit();  
40         }  
41   
42   
43 </script>   
package com.jeeplus.common.utils;

import java.io.File;
import java.util.HashMap;
import java.util.Map;

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

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

/**
 * 百度富文本框图片上传功能
 * 
 * @author zhaoshan
 *
 */
@Controller
@RequestMapping(value = "${adminPath}/ueditor/uploadimage")
public class UEditorImgUploadUtils {

    /**
     * 富文本文件上传功能
     * 
     * @param model
     * @param file
     *            上传文件
     * @param request
     * @param response
     * @return 图片回显Map
     * @throws Exception
     */
    @RequestMapping(value = "upload", method = RequestMethod.POST)
    @ResponseBody
    public Map<String, Object> testUpload(Model model,
            @RequestParam(value = "upfile", required = false) MultipartFile file, HttpServletRequest request,
            HttpServletResponse response) throws Exception {
        request.setCharacterEncoding("utf-8");
        response.setCharacterEncoding("utf-8");
        Map<String, Object> result = new HashMap<String, Object>();//
        String fileName = file.getOriginalFilename();
        String filePath = request.getSession().getServletContext().getRealPath("/upload/");
        File targetFile = new File(filePath, fileName);
        if (!targetFile.exists()) {
            targetFile.mkdirs();
        }
        try {
            file.transferTo(targetFile);
        } catch (Exception e) {
            e.printStackTrace();
        }
        result.put("name", file.getOriginalFilename());// 新的文件名
        result.put("originalName", file.getOriginalFilename());// 原始文件名
        result.put("size", file.getSize());
        result.put("state", "SUCCESS");
        result.put("url", request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
                + request.getContextPath() + "/upload/" + fileName);// 展示图片的请求url
        return result;
    }
}
原文地址:https://www.cnblogs.com/zhao-shan/p/9052223.html