fileUpload.html
<html> <head> <title>Ajax File Upload</title> <script language= "javascript" > var req; function ajaxFunction (){ var url = "example/FileUploadServlet" ; if ( window.XMLHttpRequest ){ req = new XMLHttpRequest () ; req.onreadystatechange = processStateChange; try { req.open ( "GET" , url, true ) ; } catch ( e ) { alert ( e ) ; } req.send ( null ) ; } else if ( window.ActiveXObject ) { req = new ActiveXObject ( "Microsoft.XMLHTTP" ) ; if ( req ) { req.onreadystatechange = processStateChange; req.open ( "GET" , url, true ) ; req.send () ; } } } function processStateChange (){ if ( req.readyState == 4 ){ if ( req.status == 200 ){ var xml = req.responseXML; var isNotFinished = xml.getElementsByTagName ( "finished" )[ 0 ] ; var myBytesRead = xml.getElementsByTagName ( "bytes_read" )[ 0 ] ; var myContentLength = xml.getElementsByTagName ( "content_length" )[ 0 ] ; var myPercent = xml.getElementsByTagName ( "percent_complete" )[ 0 ] ; if (( isNotFinished == null ) && ( myPercent == null )){ document.getElementById ( "initializing" ) .style. visibility = "visible" ; window.setTimeout ( "ajaxFunction();" , 100 ) ; } else { document.getElementById ( "initializing" ) .style. visibility = "hidden" ; document.getElementById ( "progressBarTable" ) .style. visibility = "visible" ; document.getElementById ( "percentCompleteTable" ) .style. visibility = "visible" ; document.getElementById ( "bytesRead" ) .style. visibility = "visible" ; myBytesRead = myBytesRead.firstChild.data; myContentLength = myContentLength.firstChild.data; if ( myPercent != null ) { myPercent = myPercent.firstChild.data; document.getElementById ( "progressBar" ) .style.width = myPercent + "%" ; document.getElementById ( "bytesRead" ) .innerHTML = myBytesRead + " of " + myContentLength + " bytes read" ; document.getElementById ( "percentComplete" ) .innerHTML = myPercent + "100%" ; window.setTimeout ( "ajaxFunction();" , 100 ) ; } else { document.getElementById ( "bytesRead" ) .style.visibility = "hidden" ; document.getElementById ( "progressBar" ) .style.width = "100%" ; document.getElementById ( "percentComplete" ) .innerHTML = "File Uploading Done!" ; document.getElementById ( "txtFile" ) .value= "" ; } } } else { alert ( req.statusText ) ; } } } </script> </head> <body> <iframe id= "uploadFrameID" name= "uploadFrame" height= "0" width= "0" frameborder= "0" scrolling= "yes" ></iframe> <form id= "myForm" enctype= "multipart/form-data" method= "post" target= "uploadFrame" action= "example/FileUploadServlet" onsubmit= "ajaxFunction()" > <input type= "file" name= "txtFile" id= "txtFile" /><br /> <input type= "submit" id= "submitID" name= "submit" value= "Upload" /> </form> <div id= "initializing" style= "visibility: hidden; position: absolute; top: 100px;" > <table width= "100%" style= "border: 1px; background-color: black;" > <tr> <td> <table width= "100%" style= "border: 1px; background-color: black; color: white;" > <tr> <td align= "center" > <b>Initializing Upload...</b> </td> </tr> </table> </td> </tr> </table> </div> <div id= "progressBarTable" style= "visibility: hidden; position: absolute; top: 100px;" > <table width= "100%" style= "border: 1px; color: white;" > <tr> <td> <table id= "progressBar" width= "100%" > <tr> <td> </td> </tr> </table> </td> </tr> </table> <table width= "100%" style= "background-color: white; color: black;" > <tr> <td align= "center" nowrap= "nowrap" > <span id= "bytesRead" style= "font-weight: bold;" > </span> </td> </tr> </table> </div> <div id= "percentCompleteTable" align= "center" style= "visibility: hidden; position: absolute; top: 100px;" > <table width= "100%" style= "border: 1px;" > <tr> <td> <table width= "100%" style= "border: 1px;" > <tr> <td align= "center" width= "100%" > <span id= "percentComplete" style= "color: blue; font-weight: bold; width:100%" > </span> </td> </tr> </table> </td> </tr> </table> </div> </body> </html>
FileUploadServlet.java
package fileupload; import javax.servlet.Servlet; import javax.servlet.http.HttpServlet; import java.io.*; import java.util.*; import javax.servlet.http.*; import org.apache.commons.fileupload.*; import javax.servlet.ServletException; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; public class FileUploadServlet extends HttpServlet implements Servlet { private static final long serialVersionUID = 2740693677625051632L ; public FileUploadServlet (){ super () ; } protected void doGet ( HttpServletRequest request, HttpServletResponse response ) throws ServletException, IOException { PrintWriter out = response.getWriter () ; HttpSession session = request.getSession () ; FileUploadListener listener = null ; StringBuffer buffy = new StringBuffer () ; long bytesRead = 0 , contentLength = 0 ; if ( session == null ){ return ; } else if ( session != null ){ listener = ( FileUploadListener ) session.getAttribute ( "LISTENER" ) ; if ( listener == null ){ return ; } else { bytesRead = listener.getBytesRead () ; contentLength = listener.getContentLength () ; } } response.setContentType ( "text/xml" ) ; buffy.append ( "<?xml version=/"1.0/" encoding=/"ISO-8859-1/"?>/n" ) ; buffy.append ( "<response>/n" ) ; buffy.append ( "/t<bytes_read>" + bytesRead + "</bytes_read>/n" ) ; buffy.append ( "/t<content_length>" + contentLength + "</content_length>/n" ) ; if ( bytesRead == contentLength ) { buffy.append ( "/t<finished />/n" ) ; session.setAttribute ( "LISTENER" , null ) ; } else { long percentComplete = (( 100 * bytesRead ) / contentLength ) ; buffy.append ( "/t<percent_complete>" + percentComplete + "</percent_complete>/n" ) ; } buffy.append ( "</response>/n" ) ; out.println ( buffy.toString ()) ; out.flush () ; out.close () ; } protected void doPost ( HttpServletRequest request, HttpServletResponse response ) throws ServletException, IOException { FileItemFactory factory = new DiskFileItemFactory () ; ServletFileUpload upload = new ServletFileUpload ( factory ) ; FileUploadListener listener = new FileUploadListener () ; HttpSession session = request.getSession () ; session.setAttribute ( "LISTENER" , listener ) ; upload.setProgressListener ( listener ) ; List uploadedItems = null ; FileItem fileItem = null ; String filePath = "c://temp" ; try { uploadedItems = upload.parseRequest ( request ) ; Iterator i = uploadedItems.iterator () ; while ( i.hasNext ()) { fileItem = ( FileItem ) i.next () ; if ( fileItem.isFormField () == false ) { if ( fileItem.getSize () > 0 ) { File uploadedFile = null ; String myFullFileName = fileItem.getName () , myFileName = "" , slashType = (myFullFileName.lastIndexOf ( "//" ) > 0 ) ? "//" : "/" ; int startIndex = myFullFileName.lastIndexOf ( slashType ) ; myFileName = myFullFileName.substring ( startIndex + 1 , myFullFileName.length ()) ; uploadedFile = new File ( filePath, myFileName ) ; fileItem.write ( uploadedFile ) ; } } } } catch ( FileUploadException e ) { e.printStackTrace () ; } catch ( Exception e ) { e.printStackTrace () ; } } }
Source Code of FileUploadListener.java
package fileupload; import org.apache.commons.fileupload.ProgressListener; public class FileUploadListener implements ProgressListener { private volatile long bytesRead = 0L , contentLength = 0L , item = 0L ; public FileUploadListener () { super () ; } public void update ( long aBytesRead, long aContentLength, int anItem ) { bytesRead = aBytesRead; contentLength = aContentLength; item = anItem; } public long getBytesRead () { return bytesRead; } public long getContentLength () { return contentLength; } public long getItem () { return item; } }
原帖地址链接:http://www.roseindia.net/ajax/File-Upload.shtml