使用ajaxfileupload.js实现上传文件功能
一直以来上传文件都是使用form表单上传文件,也看到过有人使用js上传文件,不过看起来蛮简单的也就没有怎么去理会。今天突然要使用这种方式上传文件,期间还遇到点问题。因此就记录下来,方便以后遇到这样的问题可以查看。
首先就是引入js和ajaxfileupload的文件,这个不需要多说。
然后就是ajax请求后台地址。代码如下:
<divclass="btn-file-boxpos-rel"> <inputtype="file"id="upload"name="upload"style="font-size:0;opacity:0;width:100%;height:100%;position:absolute;left:0;top:0;"/> <spanclass="btn">选择文件</span> </div> $("#upload").on("change",function(){ $.ajaxFileUpload({ url:'/test/user/imgUpload',//后台请求地址 type:'post',//请求方式当要提交自定义参数时,这个参数要设置成post secureuri:false,//是否启用安全提交,默认为false。 fileElementId:'upload',//需要上传的文件域的ID,即<inputtype="file">的ID。 dataType:'json',//服务器返回的数据类型。可以为xml,script,json,html。如果不填写,jQuery会自动判断。如果json返回的带pre,这里修改为json即可解决。 success:function(json,status){//提交成功后自动执行的处理函数,参数data就是服务器返回的数据。 alert(json.retMsg); }, error:function(json,status,e){//提交失败自动执行的处理函数。 } }); });
前台代码完成就开始开发后台代码了。
packagecom.roc.test;importjava.io.File;importjava.util.List; importjavax.servlet.http.HttpServletRequest; importjavax.servlet.http.HttpServletResponse; importjavax.ws.rs.Consumes; importjavax.ws.rs.POST; importjavax.ws.rs.Path; importjavax.ws.rs.Produces; importjavax.ws.rs.QueryParam; importjavax.ws.rs.core.Context; importjavax.ws.rs.core.MediaType; importnet.sf.json.JSONObject; importorg.apache.commons.fileupload.FileItem; importorg.apache.commons.fileupload.disk.DiskFileItemFactory; importorg.apache.commons.fileupload.servlet.ServletFileUpload; importorg.jboss.resteasy.annotations.providers.jaxb.json.BadgerFish; importorg.springframework.stereotype.Controller;importnet.sf.json.JSONObject;/** *上传文件 *@authorliaowp * */ @Controller @Path("/user") publicclassUploadImg{ @Path("/imgUpload") @POST @Produces("application/json;charset=utf-8") @Consumes(MediaType.MULTIPART_FORM_DATA) @BadgerFish publicJSONObjectupload(@QueryParam("orderId")StringorderId,@ContextHttpServletRequestrequest,@ContextHttpServletResponseresponse){ JSONObjectjsonobj=newJSONObject(); Stringfile_path=request.getSession().getServletContext().getRealPath("/")+File.separator+"corpfile"+File.separator;//文件存储路径 Stringupload_file_path=""; Filefile=newFile(file_path); if(!file.exists()&&!file.isDirectory()){//如果文件夹不存在则创建 file.mkdir(); upload_file_path=file_path; }else{ upload_file_path=file_path; } DiskFileItemFactoryfactory=newDiskFileItemFactory();//设置工厂 factory.setRepository(newFile(file_path));//设置文件存储位置 factory.setSizeThreshold(2048*1024);//设置大小,如果文件小于设置大小的话,放入内存中,如果大于的话则放入磁盘中 ServletFileUploadupload=newServletFileUpload(factory); upload.setHeaderEncoding("utf-8");//这里就是中文文件名处理的代码,其实只有一行 StringfileName=""; List<FileItem>list; JSONObjectjsonobj=newJSONObject(); try{ list=upload.parseRequest(request); for(FileItemitem:list){ if(item.isFormField()){ Stringname=item.getFieldName(); Stringvalue=item.getString("utf-8"); }else{ Stringname=item.getFieldName(); Stringvalue=item.getName(); fileName=name+".jpg"; if(item.getSize()>10485760){//您好,上传文件要小于10M! jsonobj.put("retCode","100"); jsonobj.put("retMsg","您好,上传文件要小于10M!"): }else{//上传成功 item.write(newFile(upload_file_path,fileName)); System.out.println(File.separator+"corpfile"+File.separator+fileName); jsonobj.put("retCode","0"); jsonobj.put("retMsg","您好,上传成功!"); } } } }catch(Exceptione){//上传失败 e.printStackTrace(); jsonobj.put("retCode","9999");jsonobj.put("retMsg","您好,文件上传失败,"); } returnjsonobj; } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。