1. 程式人生 > >ueditor 新增自定義上傳介面

ueditor 新增自定義上傳介面

 1.從http://ueditor.baidu.com/website/ 下載jsp版本
2.將下載的壓縮檔案解壓,命名為ueditor,複製整個資料夾到專案中
3.在頁面上新建一個textarea的標籤
<textarea id="container" name="content" style="width: 100%; height: 350px; margin: 0 auto;"></textarea>
4.
    <!-- 配置檔案 -->
    <script type="text/javascript" src="plugins/ueditor/ueditor.config.js"></script>
    <!-- 編輯器原始碼檔案 -->
    <script type="text/javascript" src="plugins/ueditor/ueditor.all.js"></script>
    <!-- 例項化編輯器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');
        UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
        UE.Editor.prototype.getActionUrl = function(action) {
            if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
                return '<%=basePath%>apps/editUpload';
            } else if (action == 'uploadvideo') {
                return '<%=basePath%>apps/editUpload';
            } else {
                return this._bkGetActionUrl.call(this, action);
            }
        }
    </script>  

5.springmvc後臺程式碼

    /**
     * 上傳圖片到OOS
     * 
     * @param file
     * @param response
     * @throws IOException
     */
    @RequestMapping(value = "/editUpload", method = RequestMethod.POST)
    @ResponseBody
    public UploaderParam editUpload(@RequestParam(value = "upfile", required = false) MultipartFile file) throws IOException {
        
        // 將MultipartFile轉換成file
        CommonsMultipartFile cf = (CommonsMultipartFile) file;
        DiskFileItem fi = (DiskFileItem) cf.getFileItem();
        File f = fi.getStoreLocation();
        String prefix = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".") + 1);// 字尾名
        String key = "upload/" + UuidUtil.get32UUID() + "." + prefix;
        try {
            OOSUtils.upload2(f, key);
        } catch (Exception e) {
//            error = e.getMessage();
        }
        String url = "http://couponworld.oss-cn-shenzhen.aliyuncs.com/" + key;
        UploaderParam uploaderParam = new UploaderParam(file.getName(), file.getOriginalFilename(), file.getSize(),
                "SUCCESS", file.getContentType(), url, file.getOriginalFilename());
        return uploaderParam;
    }  


uploadParam實體類:
public class UploaderParam {
    private String name; // 通過upfile獲取
    private String originalName; // 通過upfile獲取
    private Long size; // 通過upfile獲取
    private String state;// 成功必須為"SUCCESS"
    private String type; // 通過upfile獲取
    private String url; // 圖片回顯url
    private String title;
    public UploaderParam() {
        super();
    }
    public UploaderParam(String name, String originalName, Long size, String state, String type, String url,
            String title) {
        super();
        this.name = name;
        this.originalName = originalName;
        this.size = size;
        this.state = state;
        this.type = type;
        this.url = url;
        this.title = title;
    }
    public String getTitle() {
        return title;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getOriginalName() {
        return originalName;
    }
    public void setOriginalName(String originalName) {
        this.originalName = originalName;
    }
    public Long getSize() {
        return size;
    }
    public void setSize(Long size) {
        this.size = size;
    }
    public String getState() {
        return state;
    }
    public void setState(String state) {
        this.state = state;
    }
    public String getType() {
        return type;
    }
    public void setType(String type) {
        this.type = type;
    }
    public String getUrl() {
        return url;
    }
    public void setUrl(String url) {
        this.url = url;
    }
}