使用Jersey构建图片服务器有回显图片功能_java jersey 框架仅支持jpeg, gif, png图片-优快云博客

本文介绍了一个基于Spring MVC的图片上传方案，包括前端界面设计、图片验证、后台处理流程及图片服务器配置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.前台界面代码

[html]view plaincopy 
   
 <form id="jvForm" action="add.do" method="post" enctype="multipart/form-data">  
     <table>  
         <tr>  
             <td width="20%" class="pn-flabel pn-flabel-h"></td>  
             <td width="80%" class="pn-fcontent">  
                 <img width="100" height="100" id="allImgUrl" />  
                 <input type="hidden" name="imgUrl" id="path" />  
                 <input type="file" onchange="uploadPic()" name="pic" id="logoPic"/>  
             </td>  
         </tr>  
     </table>  
 </form>  

2.前台JS代码

[javascript]view plaincopy 
   
 <script type="text/javascript">  
     //上传图片  
     function uploadPic() {  
         //定义参数  
         var options = {  
             url : "/upload/uploadPic.do",  
             dataType : "json",  
             type : "post",  
             beforeSubmit : function(formData,jqForm,options){  
                 // 判断是否为图片  
                 // 将jqForm转成DOM对象  
                 var f = jqForm[0];  
                 // 获取DOM对象中name为logoPic的值  
                 var v = f.logoPic.value;  
                 // 获取扩展名,并转成小写  
                 var ext = v.substring(v.length-3).toLowerCase();  
                 // 比对扩展名 jpg gif bmp png   
                 if(ext != "jpg" && ext != "gif" && ext != "bmp" && ext != "png"){  
                     alert("只允许上传图片!");  
                     return false;  
                 }  
                 //校验提交的表单  
                 return true;  
             },  
             success : function(data) {  
                 // 回显图片内容  
                 $("#allImgUrl").attr("src", data.url);  
                 $("#path").val(data.path);  
             }  
         };  
    
         // jquery.form使用方式  
         $("#jvForm").ajaxSubmit(options);  
     }  
 </script>  

3.在Spring中配置图片转换器

[html]view plaincopy 
   
 <!-- 上传图片转换器 -->  
 <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">    
     <!-- 设置上传文件的最大尺寸为1MB -->    
     <property name="maxUploadSize" value="1048576"/>  
 </bean>  

4.创建UploadController以及工具类

[java]view plaincopy 
   
 package cn.itcast.core.controller.admin;  
    
 import java.io.IOException;  
 import java.text.DateFormat;  
 import java.text.SimpleDateFormat;  
 import java.util.Date;  
 import java.util.Random;  
    
 import javax.servlet.http.HttpServletResponse;  
    
 import org.apache.commons.io.FilenameUtils;  
 import org.json.JSONObject;  
 import org.springframework.stereotype.Controller;  
 import org.springframework.web.bind.annotation.RequestMapping;  
 import org.springframework.web.bind.annotation.RequestParam;  
 import org.springframework.web.multipart.MultipartFile;  
    
 import com.sun.jersey.api.client.Client;  
 import com.sun.jersey.api.client.WebResource;  
    
 import cn.itcast.common.web.ResponseUtils;  
 import cn.itcast.core.web.Constants;  
    
 @Controller  
 public class UploadController {  
     // 上传图片  
     @RequestMapping(value = "/upload/uploadPic.do")  
     public void uploadPic(@RequestParam(required = false) MultipartFile pic, HttpServletResponse response) {  
         // 扩展名  
         String ext = FilenameUtils.getExtension(pic.getOriginalFilename());  
         // 图片名称生成策略  
         DateFormat df = new SimpleDateFormat("yyyyMMddHHmmssSSS");  
         // 图片名称一部分  
         String format = df.format(new Date());  
         // 随机三位数  
         Random r = new Random();  
         // n 1000 0-999 99  
         for (int i = 0; i < 3; i++) {  
             format += r.nextInt(10);  
         }  
         // 实例化一个Jersey  
         Client client = new Client();  
         // 保存数据库  
         String path = "upload/" + format + "." + ext;  
         // 另一台服务器的请求路径是?  
         String url = Constants.IMAGE_URL + path;  
         // 设置请求路径  
         WebResource resource = client.resource(url);  
    
         // 发送开始 POST GET PUT  
         try {  
             resource.put(String.class, pic.getBytes());   
         } catch (IOException e) {  
             e.printStackTrace();  
         }  
    
         // 返回二个路径  
         JSONObject jsonObject = new JSONObject();  
         jsonObject.put("url", url);  
         jsonObject.put("path", path);  
    
         ResponseUtils.renderJson(response, jsonObject.toString());  
     }  
 }  

[java]view plaincopy 
   
 package cn.itcast.core.web;  
    
 public interface Constants {  
     /** 
      * 图片服务器 
      */  
     public static final String IMAGE_URL = "http://localhost:8088/BabasportProject_ImageService/";  
 }  

[java]view plaincopy 
   
 package cn.itcast.common.web;  
    
 import java.io.IOException;  
    
 import javax.servlet.http.HttpServletResponse;  
    
 public class ResponseUtils {  
     // 发送内容  
     public static void render(HttpServletResponse response, String contentType, String text) {  
         response.setContentType(contentType);  
         try {  
             response.getWriter().write(text);  
         } catch (IOException e) {  
             e.printStackTrace();  
         }  
     }  
    
     // 发送的是JSON  
     public static void renderJson(HttpServletResponse response, String text) {  
         render(response, "application/json;charset=UTF-8", text);  
     }  
    
     // 发送xml  
     public static void renderXml(HttpServletResponse response, String text) {  
         render(response, "text/xml;charset=UTF-8", text);  
     }  
    
     // 发送text  
     public static void renderText(HttpServletResponse response, String text) {  
         render(response, "text/plain;charset=UTF-8", text);  
     }  
 }  

5.搭建另一个Tomcat,作为图片服务器
图片服务器Tomcat的设置 tomcat/conf/web.xml中内容更改

[html]view plaincopy 
   
 <servlet>  
     <servlet-name>default</servlet-name>  
     <servlet-class>org.apache.catalina.servlets.DefaultServlet</servlet-class>  
     <init-param>  
         <param-name>debug</param-name>  
         <param-value>0</param-value>  
     </init-param>  
     <init-param>  
         <param-name>readonly</param-name>  
         <param-value>false</param-value>  
     </init-param>  
     <init-param>  
         <param-name>listings</param-name>  
         <param-value>false</param-value>  
     </init-param>  
     <load-on-startup>1</load-on-startup>  
 </servlet>  