Java實現(xiàn)文件上傳的兩種方法(uploadify和Spring)
最近項目中用到的兩種文件上傳方式做一下總結(jié):
一. uploadify:
uploadify控件的scripts和styles在這里:圖片上傳
JSP:
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ include file="../jsp/include/taglibs.jsp"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Upload</title> <script src="<c:url value="/scripts/jquery-1.8.3.min.js"/>" type="text/javascript"></script> <script type="text/javascript" src="<c:url value="/scripts/jquery-admin/jquery-ui.js" />"></script> <script type="text/javascript" src="<c:url value="/scripts/jquery-admin/component.js" />"></script> <script type="text/javascript" src="<c:url value="/scripts/jquery-admin/jquery-validate.js" />"></script> <script type="text/javascript" src="<c:url value="/scripts/jquery-admin/jquery-form.js" />"></script> <script type="text/javascript"src="<c:url value="/scripts/jquery-admin/init.js" />"></script> <script type="text/javascript"src="<c:url value="/scripts/jquery-admin/jquery.ui.datepicker-zh-CN.js" />"></script> <link rel="stylesheet" href="<c:url value='/styles/admin/admin1.css'/>" rel="external nofollow" > <link href="<c:url value=" rel="external nofollow" rel="external nofollow" /styles/jquery-ui/jquery-ui.css" />" rel="stylesheet" type="text/css" /> <script src="<c:url value="/scripts/jquery-uploadify/jquery.uploadify.min.js"/>" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="<c:url value=" rel="external nofollow" rel="external nofollow" /scripts/jquery-uploadify/uploadify.css"/>"> <style type="text/css"> #jidAttachTable {width:400px;font-size:14px;border:1px solid #d3d3d3;border-left-width:0;border-top-width:0;} #jidAttachTable td{border: 1px solid #d3d3d3;text-align:left;padding:5px;border-right-width:0;border-bottom-width:0;} #jidAttachTable .i-i-title{width:450px;} #jidAttachTable .i-i-content{width:100px;} </style> <script type="text/javascript"> $(function(){ //視頻上傳 var uploadVideo = $('#file_upload_video').uploadify({ 'buttonText':'上傳視頻', 'multi': false, 'fileTypeDesc': '請選擇wmv視頻文件', 'fileTypeExt': '*.wmv', 'swf' : '<c:url value="/scripts/jquery-uploadify/uploadify.swf"/>"', 'uploader' : '<c:url value="/uploadAttach.do"/>' , 'onUploadError': uploadVideoUploadError, 'onUploadSuccess':uploadVideoUploadSuccess }); function uploadVideoUploadError(){ alert("上傳視頻發(fā)生錯誤"); } function uploadVideoUploadSuccess(file, data, response){ var strs_ = data.split("@"); var videoName_ = strs_[0]; var videoPath_ = strs_[1]; $("#vidioPreview").val("/upload/" + videoPath_); } var arrAttach = new Array(); //將現(xiàn)有的附件加載到臨時數(shù)組中 var nowAttachIds_ = "${attachs}"; //初始化現(xiàn)有的附件 if(nowAttachIds_ != null && nowAttachIds_ != ""){ var ids_ = nowAttachIds_.split("@") ; var i = 0; for( ; i < ids_.length ; i++){ arrAttach.push(ids_[i]); } } //附件上傳 var uploadAttach = $('#file_upload_attach').uploadify({ 'buttonText':'上傳附件', 'multi': false, 'swf' : '<c:url value="/scripts/jquery-uploadify/uploadify.swf"/>"', 'uploader' : '<c:url value="/uploadAttach.do"/>', 'onUploadError': uploadAttachUploadError, 'onUploadSuccess':uploadAttachUploadSuccess }); function uploadAttachUploadError(){ alert("上傳過程中發(fā)生錯誤,您可以嘗試重復(fù)上傳一次!") } function uploadAttachUploadSuccess(file, data, response){ var strs_ = data.split("@") ; var documnetId_ = strs_[0]; var fileName_ = strs_[1]; var attach_ = "<tr class=\"jsClassDeleteAttachButtonTR\"> " + " <td class='i-i-title'>" + fileName_ + "</td> " + " <td class='i-i-content'><button class=\"jsClassDeleteAttachButton\" dataAttach="+ documnetId_ +">刪除</button></td>" + " </tr>"; arrAttach.push(documnetId_); $("#jidAttachTable").append(attach_); } $(".jsClassDeleteAttachButton").live("click",function(){ var data_ = $(this).attr("dataAttach"); var i_ = 0; for(;i_ < arrAttach.length; i_++){ if(data_ == arrAttach[i_]){ arrAttach.splice(i_,1); break; } } $(this).parent().parent().remove(); //alert(arrAttach) }); }); var videotag = ""; $(function() { $("#PreviewDiv").dialog({ title: "視頻預(yù)覽", autoOpen: false, modal: true, resizable: false, position : "center", width: "489px", buttons: { "關(guān)閉": function() { $("#PreviewDiv").dialog("close"); } } }); $( "#PreviewDiv" ).on( "dialogopen", function( event, ui ) { $("#PreviewDiv").html(videotag); } ); $( "#PreviewDiv" ).on( "dialogclose", function( event, ui ) { $("#PreviewDiv").html(""); } ); }); var video_root_path = "http://localhost:8080/ProjectTest/"; function openDownloadFrame() { var _storePreview= video_root_path + $("#vidioPreview").val(); var _embed_head = '<EMBED src=\"'; var _embed_tail = '\" width=\"450\" height=\"400\" type=\"audio/x-wav\" loop=\"false\" autostart=\"true\">' + '</EMBED>'; videotag = _embed_head + _storePreview + _embed_tail; $("#PreviewDiv").dialog("open"); } </script> </head> <body> <form:form id="form" name="basedata" modelAttribute="basedata" action="update.do" method="post" > <div style="height:40px;border:1px solid #ebebeb;padding:10px;"> <div style="width:150px;float:left;"> <input id="file_upload_video" name="file_upload_video" type="file" multiple="true"> </div> <div style="padding-left:10px;"> <input id="vidioPreview" type="text" name="${bad.attributeStore}" value="${basedata[storeName]}"/> <input onclick="openDownloadFrame();" type="button" name="button" value="預(yù)覽"> </div> </div> <div id='divContext' style="height:40px;border:1px solid #ebebeb;padding:10px;"> <div style="width:150px;float:left;"> <input id="file_upload_attach" name="file_upload_attach" type="file" multiple="true"> </div> <div class="i-attachContainer"> <table id="jidAttachTable"> <c:forEach items="${attachList}" var="attach"> <tr class="jsClassDeleteAttachButtonTR"> <td class='i-i-title'>${attach.name}</td> <td class='i-i-content'> <button class="jsClassDeleteAttachButton" dataAttach="${attach.id}">刪除</button> </td> </tr> </c:forEach> </table> </div> </div> <div id="PreviewDiv"> </div> </form:form> </body> </html>
后臺Java:
package com.sun.fileUpload; import java.io.BufferedOutputStream; import java.io.File; import java.io.FileOutputStream; import java.io.IOException; import java.util.Date; import java.util.Iterator; import java.util.LinkedList; import java.util.List; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.FileUploadException; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; import org.springframework.stereotype.Controller; import org.springframework.ui.ModelMap; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.multipart.MultipartFile; @Controller public class upload{ // 附件上傳 @RequestMapping("/uploadAttach.do") public void attachUpload(ModelMap modelMap,HttpServletRequest request ,HttpServletResponse response) throws IOException { System.out.println("upload file .... start"); String savePath = request.getSession().getServletContext().getRealPath("/") + "upload"; System.out.println("store path is :" + savePath); File f1 = new File(savePath); if (!f1.exists()) { f1.mkdirs(); } DiskFileItemFactory fac = new DiskFileItemFactory(); ServletFileUpload upload = new ServletFileUpload(fac); upload.setHeaderEncoding("utf-8"); List<FileItem> fileList = null; try { fileList = upload.parseRequest(request); } catch (FileUploadException ex) { ex.printStackTrace(); return; } Iterator<FileItem> it = fileList.iterator(); String name = ""; System.out.println("deal the files ... start"); //存儲完畢保存進入數(shù)據(jù)庫 //Document document = null; while (it.hasNext()) { FileItem item = it.next(); if (!item.isFormField()) { name = item.getName(); long size = item.getSize(); String type = item.getContentType(); if (name == null || name.trim().equals("")) { continue; } System.out.println("dealing file info:" + "fileName" + name + " size" + size + " type:" + type); //擴展名格式: if (name.lastIndexOf(".") >= 0) { name.substring(name.lastIndexOf(".")); } //存文件到磁盤指定路徑 且存儲文件記錄存入數(shù)據(jù)庫,如果存儲發(fā)生故障,數(shù)據(jù)庫記錄也會創(chuàng)建失敗 /* document = new Document(); document.setFileType(extName); document.setFullName(name); document.setDescription(name); document.setName(name); document.setUploadDate(new Date()); document = documentManager.saveWithFileStore(document,item,savePath,extName);*/ System.out.println(new Date() + "persist id :" + name); File saveFile = new File(savePath + "/" + name); try { item.write(saveFile); } catch (Exception e) { e.printStackTrace(); throw new RuntimeException(new Date() + "store file error"); } } } System.out.println("deal the files end"); System.out.println("upload file .... end"); response.getWriter().print(name + "@" + name); } }
這里把數(shù)據(jù)庫更新給省略了,有需要可以自己添加。
除上傳外,其他實現(xiàn)功能:
1. 視頻上傳后的預(yù)覽功能
2. 視頻是單文件上傳,附件是多文件上傳和刪除
二. Spring默認(rèn)的上傳功能:
JSP:
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ include file="../jsp/include/taglibs.jsp"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Upload</title> <script src="<c:url value="/scripts/jquery-1.8.3.min.js"/>" type="text/javascript"></script> <script type="text/javascript" src="<c:url value="/scripts/jquery-admin/jquery-ui.js" />"></script> <link rel="stylesheet" href="<c:url value='/styles/admin/ace.css'/>" rel="external nofollow" > <style type="text/css"> .file { position: relative; display: inline-block; background: #428BCA; border: 1px solid #99D3F5; border-radius: 4px; padding: 4px 12px; overflow: hidden; color: #000000; text-decoration: none; text-indent: 0; line-height: 20px; } .file:link { color: white; text-decoration:none; } .file input { position: absolute; font-size: 100px; right: 0; top: 0; opacity: 0; } .file:hover { background: #1B6AAA; border-color: #78C3F3; color: white; text-decoration: none; } </style> </head> <body> <form:form id="fileUploadForm" method="post" action="uploadFile.do" name="uploadfile" modelAttribute="uploadfile" enctype="multipart/form-data"> 點擊保存后上傳: <a href="javascript:;" rel="external nofollow" class="file">選擇文件 <input type="file" name="videoFile" id="videoFile"> </a> <input type="text" style="width:300px;" id="resourceUrl-field" name="resourceUrl" placeholder="資源地址" class="col-sm-12" value="${uploadfile}"/> <input type="submit" value="保存" class="btn btn-sm btn-primary"> </form:form> </body> </html>
后臺Java:
package com.sun.fileUpload; import java.io.BufferedOutputStream; import java.io.File; import java.io.FileOutputStream; import java.io.IOException; import java.util.Date; import java.util.Iterator; import java.util.LinkedList; import java.util.List; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.FileUploadException; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; import org.springframework.stereotype.Controller; import org.springframework.ui.ModelMap; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.multipart.MultipartFile; @Controller public class upload{ @RequestMapping(value = "/uploadFile.do") public String uploadController(HttpServletRequest request,ModelMap modelMap, @RequestParam("videoFile") MultipartFile videoFile) throws IllegalStateException, IOException{ String savePath = request.getSession().getServletContext().getRealPath("/") + "upload"; try { uploadSingleFile(savePath, videoFile, request.getSession().getServletContext().getRealPath("/")); }catch (Exception e) { return "/upload"; } modelMap.addAttribute("uploadfile", "upload/" + videoFile.getOriginalFilename()); return "/upload"; } /** * * @param path 這個path 是upload的子目錄路徑 比如 path=/image 最終將下載到[root/upload/image/]目錄下 * @param file * @return * @throws java.io.IOException */ public static String uploadSingleFile(String path, MultipartFile file, String rootPath) { if (!file.isEmpty()) { byte[] bytes; try { bytes = file.getBytes(); // Create the file on server File serverFile = new File(path + "/" + file.getOriginalFilename()); BufferedOutputStream stream = new BufferedOutputStream(new FileOutputStream(serverFile)); stream.write(bytes); stream.close(); System.out.println("Server File Location=" + serverFile.getAbsolutePath()); return getRelativePathFromUploadDir(serverFile, rootPath).replaceAll("\\\\", "/"); } catch (IOException e) { e.printStackTrace(); } }else{ System.out.println("文件內(nèi)容為空"); } return null; } /** * * @param file * @return 返回從upload目錄下面的相對路徑 */ public static String getRelativePathFromUploadDir(File file, String rootPath){ if(null==file) return ""; String absolutePath = file.getAbsolutePath(); if(absolutePath.indexOf(rootPath)!=-1 && rootPath.length()<absolutePath.length()) return absolutePath.substring(absolutePath.indexOf(rootPath)+rootPath.length()); else return ""; } }
Spring配置文件springmvc-servlet.xml中添加:
<bean id=”multipartResolver” class=”org.springframework.web.multipart.commons.CommonsMultipartResolver”> <property name=”defaultEncoding” value=”UTF-8″ /> </bean>
如果和uploadify同時使用的話,需要做一些修改,否則uploadify的上傳文件會被Spring攔截:
<!-- 支持上傳文件 --> lt;bean id="multipartResolver" class="org.sun.com.MyMultipartResolver"> <!--設(shè)置上傳文件的編碼格式,用于解決上傳的文件中文名亂碼問題 --> <property name="defaultEncoding"> <value>UTF-8</value> </property> <property name="excludeUrls" value="/uploadAttach.do,/uploadVideo.do"/> lt;/bean>
org.sun.com.MyMultipartResolver:
package org.sun.com; import javax.servlet.http.HttpServletRequest; import org.springframework.web.multipart.commons.CommonsMultipartResolver; /** * @author Sun */ public class MyMultipartResolver extends CommonsMultipartResolver { private String excludeUrls; private String[] excludeUrlArray; public String getExcludeUrls() { return excludeUrls; } public void setExcludeUrls(String excludeUrls) { this.excludeUrls = excludeUrls; this.excludeUrlArray = excludeUrls.split(","); } /** * 這里是處理Multipart http的方法。如果這個返回值為true,那么Multipart http body就會MyMultipartResolver 消耗掉.如果這里返回false * 那么就會交給后面的自己寫的處理函數(shù)處理例如剛才ServletFileUpload 所在的函數(shù) * @see org.springframework.web.multipart.commons.CommonsMultipartResolver#isMultipart(javax.servlet.http.HttpServletRequest) */ @Override public boolean isMultipart(HttpServletRequest request) { for (String url: excludeUrlArray) { // 這里可以自己換判斷 if (request.getRequestURI().contains(url)) { return false; } } return super.isMultipart(request); } }
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- JavaServlet的文件上傳和下載實現(xiàn)方法
- java 網(wǎng)絡(luò)編程之TCP通信和簡單的文件上傳功能實例
- Java實現(xiàn)文件上傳服務(wù)器和客戶端
- java實現(xiàn)多文件上傳至本地服務(wù)器功能
- Java實現(xiàn)文件上傳至服務(wù)器的方法
- java文件上傳至ftp服務(wù)器的方法
- SpringBoot文件上傳控制及Java 獲取和判斷文件頭信息
- Java實現(xiàn)的文件上傳下載工具類完整實例【上傳文件自動命名】
- Retrofit+Rxjava實現(xiàn)文件上傳和下載功能
- RxJava+Retrofit+OkHttp實現(xiàn)文件上傳
- java組件SmartUpload和FileUpload實現(xiàn)文件上傳功能
- java 文件上傳(單文件與多文件)
- Java 文件上傳的實例詳解
- 全面分析Java文件上傳
相關(guān)文章
java中的構(gòu)造函數(shù)什么時候被調(diào)用執(zhí)行
這篇文章主要介紹了java中的構(gòu)造函數(shù)什么時候被調(diào)用執(zhí)行問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03IntelliJ IDEA搜索整個項目進行全局替換(有危險慎用)
今天小編就為大家分享一篇關(guān)于IntelliJ IDEA搜索整個項目進行全局替換(有危險慎用),小編覺得內(nèi)容挺不錯的,現(xiàn)在分享給大家,具有很好的參考價值,需要的朋友一起跟隨小編來看看吧2018-10-10解決Druid動態(tài)數(shù)據(jù)源配置重復(fù)刷錯誤日志的問題
使用druid數(shù)據(jù)庫連接池實現(xiàn)動態(tài)的配置數(shù)據(jù)源功能,在配置過程中出現(xiàn)一個問題既然是用戶自己配置的數(shù)據(jù)源,就無法避免輸入錯誤,連接失敗等情況,關(guān)于這個問題怎么處理呢,今天小編通過本文給大家詳細(xì)說明下,感興趣的朋友一起看看吧2021-05-05

SpringBoot使用AOP實現(xiàn)統(tǒng)計全局接口訪問次數(shù)詳解