UMeditor上传图片配置

首页 > 代码库 > UMeditor上传图片配置

2024-11-28 04:33:02 203人阅读

UMeditor是UEditor的简洁版，保留了UEditor中常用的功能，在代码量和加载速度上均有很大的提升。

本文上传图片的执行后台基于jfinal框架。

1、html加载调用的样式和脚本，为保证图片能上传到服务器，此处需要做几点配置：

　　1）window.UMEDITOR_HOME_URL是相对于网站根目录的相对路径，为了避免上传过程中的路径问题，此处最好做配置

　　2）imageUrl 图片上传到后台时，对应的处理方法。

　　3）imagePath图片的网络路径，图片保存时只保存了图片名称，显示时需要做网络映射，下面的tomcat server.xml中会有相关配置。

 1  <link href="themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
 2     <script type="text/javascript" src="third-party/jquery.min.js"></script>
 3     <script type="text/javascript" src="third-party/template.min.js"></script>
 4     <script type="text/javascript" charset="utf-8" src="umeditor.config.js"></script>
 5     <script type="text/javascript" charset="utf-8" src="umeditor.min.js"></script>
 6     <script type="text/javascript" src="lang/zh-cn/zh-cn.js"></script>
 7 
 8 <!--style给定宽度可以影响编辑器的最终宽度-->
 9 <script type="text/plain" id="myEditor" style="width:1000px;height:240px;">
10     <p>这里我可以写一些输入提示</p>
11 </script>
12 <script>
13 window.UMEDITOR_HOME_URL = "${base}/back/umeditor/";/** "相对于网站根目录的相对路径"**/
14 var um = UM.getEditor(‘myEditor‘, {
15     imageUrl:‘${base}/back/uploadImages‘,/**图片上传执行action**/
16     imagePath:‘/upload/‘,/**图片网络显示路径**/
17     focus: true
18 });
19 
20 </script>

2、后台处理程序

 1 /**上传图片**/
 2     public void uploadImages(){
 3         List<Map<String,Object>> upload=uploadFiles(getRequest(), PropKit.get("upload_path"), 10, "", "gif,jpg,jpeg,png,bmp");
 4         renderJson(JsonKit.toJson(upload.get(0)));
 5     }
 6 　　private static FileRenamePolicy fileRenamePolicy = new DefaultFileRenamePolicy();
 7     /**
 8      * 
 9      * @param request 文件上传请求
10      * @param uploadPath 文件上传路径
11      * @param maxPostSize 文件传输最大大小（MB）
12      * @param encoding 字符编码集设置（默认utf-8）
13      * @param filetype 上传文件格式（扩展名与扩展名间用","隔开，扩展名前没有"."）
14      * @return 上传的文件名及文件路径
15      */
16     public static List<Map<String,Object>> uploadFiles(HttpServletRequest request,String uploadPath,int maxPostSize,String encoding,String filetype){
17         
18         encoding=encoding==null||"".equals(encoding)?"utf-8":encoding;
19         
20         File dir = new File(uploadPath);
21         if ( !dir.exists()) {
22             if (!dir.mkdirs()) {
23                 throw new IllegalArgumentException("文件路径无法创建");
24             }
25         }
26         
27         List<Map<String,Object>> uploadFileDatas=new ArrayList<Map<String,Object>>();
28         
29         try {
30             MultipartRequest multipartRequest = new  MultipartRequest(request, uploadPath, maxPostSize*1024*1024, encoding, fileRenamePolicy);
31             Enumeration<?> files = multipartRequest.getFileNames();
32             while (files.hasMoreElements()) {
33                 String name = (String)files.nextElement();
34                 String filesystemName = multipartRequest.getFilesystemName(name);
35                 // 校验文件格式
36                 if (filesystemName != null) {
37                     Map<String, Object> ulfd=new HashMap<String,Object>();
38                     if(checkFileType(filesystemName.substring(filesystemName.lastIndexOf(".")+1),filetype)){
39                         ulfd.put("parameterName", name);
40                         ulfd.put("uploadPath", uploadPath+System.getProperty("file.separator")+filesystemName);//图片的物理路径
41                         ulfd.put("url", filesystemName);
42                         ulfd.put("originalFileName", multipartRequest.getOriginalFileName(name));
43                         ulfd.put("contentType", multipartRequest.getContentType(name));
44                         ulfd.put("state", "SUCCESS");
45                     }else{
46                         new File(uploadPath+"/"+filesystemName).delete();
47                         ulfd.put("state", "文件格式非法");
48                     }
49                     uploadFileDatas.add(ulfd);
50                 }
51             }
52         } catch (Exception e) {
53             throw new RuntimeException(e);
54         }
55         return uploadFileDatas;
56     }
57     
58     private static boolean checkFileType(String extension,String filetype){
59         filetype=(filetype==null?"":filetype);
60         String[] types=filetype.split(",");
61         for(int i=0;i<types.length;i++){
62             if(!extension.trim().toLowerCase().equals(types[i].trim().toLowerCase())){
63                 break;
64             }else if(i==types.length-1){
65                 return false;
66             }
67         }
68         return true;
69     }