Jersey後端服務接收ajax前端的圖片上傳

近期的項目裏須要在前端上傳圖片後端接收處理。前端JSP頁面使用Ajax上傳圖片後端使用Jersey框架提供restful接口接收處理圖片。

1、前端的處理

jsp頁面中圖片上傳沒有使用form表單而是直接使用file類型的input控件

<input type="file" name="file" class="inpTxtA" value="" id="appLogo"/>
<input class="inpTxtA" value="" id="appID"/>

js中使用ajax處理文件上傳

var formData = new FormData();//使用formData來上傳數據
                              //content-Type是form-data類型
formData.append("appId", $("#appID").val());
formData.append("file", $("#appLogo")[0].files[0]);//取file類型input中的文件

$.ajax({
	method : "POST",
	url : "/apps/updateApp",
	timeout : 10000, //超時時間設置單位毫秒
	crossDomain: true,
	async: false,
	headers: {
	    "client-type":"platform"
	},
	dataType:"json",
	data: formData,
	contentType:false,//
	processData:false,//數據不作預處理
	success : function(response) {
		alert(response.msg);
		return;
	},
	error : function(e) {
		alert(response.msg);
		return;
	}
});

2、服務端處理

服務端使用jersey框架提供restful接口由於數據是以form-data的參數類型來傳遞的因此服務端接口中的參數類型要指定爲@FormDataParam。

/**應用信息更新
*文件以InputStream類型上傳
*文件描述信息以FormDataContentDisposition對象封裝。
*/
@Path("updateApp")
@POST
@Consumes(MediaType.MULTIPART_FORM_DATA)
public Response updateApp(@FormDataParam("file") InputStream inputStream
            ,@FormDataParam("file") FormDataContentDisposition cp 
            ,@FormDataParam("appId")String appId){
    String name = cp.getFileName();
    try{
        name = new String(name.getBytes("ISO-8859-1"),"UTF-8");
    }catch(Exception e){
        result.put("errcode", 1);
    	result.put("msg", "應用圖標名稱異常");
    	return JSONUtil.toJSONResponse(result);
    }
    ...//進一步處理
}

3、可能出現的異常

一、在開發過程當中前端對FormData的封裝可能會出現問題提示invocation TypeError之類的異常。通常的緣由是沒有添加這兩個參數

contentType:false,//
processData:false,//數據不作預處理

這兩個參數申明不對數據作預處理。若是缺失那麼前端在封裝數據時會進行預處理好比x-www-form-urlencoded會將參數封裝到url裏面對於formData類型的數據預處理可能會出現封裝異常。

二、後端服務接收參數時若是沒有正確指定參數類型也可能會報以下異常

嚴重: A message body reader for Java class javax.servlet.http.HttpServletRequest, 
and Java type interface javax.servlet.http.HttpServletRequest, and MIME media 
type multipart/form-data;boundary=----WebKitFormBoundaryRJ7E8B7MDzDGjBHG 
was not found.
The registered message body readers compatible with the MIME media type are:
multipart/* ->
  com.sun.jersey.multipart.impl.MultiPartReaderServerSide
*/* ->
  com.sun.jersey.core.impl.provider.entity.FormProvider
  com.sun.jersey.core.impl.provider.entity.MimeMultipartProvider
  com.sun.jersey.core.impl.provider.entity.StringProvider

這是由於參數是以formData格式上傳的若是接口中不指定參數類型爲@FormDataParam則會出現上述異常提示。