目前 JSF 對于檔案上傳的支持很差，JSC 內更是缺少檔案上傳的組件
除非使用 Orcale ADF 的組件，但是 Oracle ADF 并非免費的。
本篇文章主要就是跟大家分享如何在 JSF 內使用免費的 Jakarta Commons FileUpload (http://jakarta.apache.org/commons/fileupload/ ) 組件來實作檔案上傳功能。
有幾點注意事項，這邊必須先要提出的：
1. Servlet 部分改自本討論區 JiaYun 大大的「檔案上傳 JSP 小范例」，希望他不會介意！^^" （如果需要更清楚的 Jakarta Commons FileUpload 范例，那篇文章
會是更好的選擇。）
2. 檔案上傳，必須把 form 的 enctype 更改如下：
| <h:form binding="#{AttachFile.form1}" enctype="multipart/form-data" id="form1"> |
但是以上的 JSF 標簽 compile 都會正常，但是在這個 form 里面，其它組件的 action 都會無法正常觸發。所以這邊僅使用一般的 JSP 頁面。
3. 這篇獻丑的教學其實是使用 JSF（其它頁面） -> JSP(選擇檔案頁面) -> Servlet（儲存使用者上傳的檔案） -> JSF（其它頁面） 的流程。
說穿了，只是使用舊的 JSP + Servlet 技術，請各位高手海涵。
流程一(選擇檔案的 JSP 頁面)：
<f:verbatim>
<form action="UploadFile" enctype="multipart/form-data" method="post">
File：<input name="txtFile" type="file"/><br/>
Description：<input name="txtDesc" type="text"/><br/>
<input type="checkbox" name="chkAdd"/>Add another file<br/>
<input style="height: 27px; left: 0px; top: 96px; position: absolute; width: 72px" type="submit" value="Add"/>
<input style="height: 27px; left: 96px; top: 96px; position: absolute; width: 72px" type="submit" value="Cancel"/>
</form>
</f:verbatim>
<h:form binding="#{AttachFile.form1}" id="form1"/>
|
1. 這個頁面包含：
一個 type="file" 的 textbox
一個一般的 textbox 提供為輸入檔案描述
一個 checkbox，提供多重上傳檔案
一個 Add 及一個 Cancel 的 Button
2. 如果使用者選取 checkBox，在后面的 Servlet 處理完，則回到這一頁 ，選擇另一個上傳的檔案。 如果沒有勾選，則前進到其它的 JSF 頁面。
3. UploadFile 為后面要處理檔案儲存的 Servlet 名稱。
4. 以上只寫出修改的地方，其它 JSF 預設的 tag 就不寫出來了。
流程二(web.xml)：
<servlet>
<servlet-name>Upload_File</servlet-name>
<servlet-class>webapplication1.UploadFile</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Upload_File</servlet-name>
<url-pattern>/UploadFile</url-pattern>
</servlet-mapping>
|
1. 請把這一段程序代碼與 web.xml 內的其它 servlet tag 放在一塊，比較不會出問題。
2. 這段大致的意義為：當你向 server 要求 /UploadFile 這個 URL 時， server 會使用 webapplication1.UploadFile 這個 servlet 來處理你的要求。
流程三(后端處理檔案的 Servlet)：
UploadFile
import java.io.*;
import java.util.*;
import java.sql.*;
import javax.servlet.*;
import javax.servlet.http.*;
import org.apache.commons.fileupload.*;
public class UploadFile extends HttpServlet{
public void doPost(HttpServletRequest servletRequest,
HttpServletResponse servletResponse) throws ServletException,
IOException {
//取得 JSF 的 SessionBean
SessionBean1 sesBean=(SessionBean1)servletRequest.getSession().getAttribute("SessionBean1");
//取得 JSF 的 ApplicationBean
ApplicationBean1 appBean=(ApplicationBean1)getServletContext().getAttribute("ApplicationBean1");
// 宣告將上傳之檔案放置到服務器的 / .... /upload 目錄中
//String saveDirectory = appBean.getAttachPath();
// 宣告暫存目錄
//String tmpDirectory = "c:\\";
// 宣告限制上傳之檔案總大小為, 單位為 byte, -1 表示無限制
int maxPostSize = -1;
// 宣告儲存敘述上傳檔案內容的變量
String FileDescription = "";
// 宣告是否接下來要繼續新增檔案
boolean hasMore = false;
// 宣告儲存上傳文件名稱的變量
String FileName = "";
// 宣告儲存上傳檔案大小的變量
long FileSize = 0;
// 宣告儲存上傳檔案型態的變量
//String ContentType = null;
// 計算上傳檔案之個數
int count = 0 ;
try {
DiskFileUpload upload = new DiskFileUpload();
// 處理中文檔名問題
upload.setHeaderEncoding("UTF-8");
// 設定內存存放數據的大小, 超過則寫入檔案, 有設定暫存目錄, 暫存盤置于暫存目錄下
//upload.setSizeThreshold(4096);
// 設定總上傳大小限制
//upload.setSizeMax(maxPostSize);
// 設定暫存目錄
//upload.setRepositoryPath(tmpDirectory);
List items =upload.parseRequest((HttpServletRequest)servletRequest);
Iterator iter = items.iterator();
FileItem fItem=null;
while(iter.hasNext()) {
FileItem item = (FileItem) iter.next();
if (item.isFormField()) {
// 一般字段
if(item.getFieldName().equalsIgnoreCase("txtDesc")) {
// 取得檔案敘述
FileDescription = item.getString("UTF-8");
}
else if(item.getFieldName().equalsIgnoreCase("chkAdd")) {
// 取得接下來將前往的頁面
hasMore = item.getString().equalsIgnoreCase("on") ? true: false;
}
}
else {
// 檔案字段
// 否則取得檔案信息
FileName = item.getName();
// 因為不同的瀏覽器會造成傳遞 path + filename, 有些則只有 filename
// for wintel platform
FileName = FileName.substring(FileName.lastIndexOf("\\")+1);
// for unix-like platform
FileName = FileName.substring(FileName.lastIndexOf("/")+1);
//ContentType = item.getContentType();
FileSize = item.getSize();
fItem=item;
}
}
//--Delete--
//如果需要的話
//你可以在這里使用前面取得的 SessionBean 及 ApplicationBean
//里面的參數對你的數據庫做操作，并把檔案描述在這里存入數據庫
//寫入檔案
File uploadedFile = new File(appBean.getAttachPath() + FileName);
fItem.write(uploadedFile);
}
catch(Exception ex) {
//例外處理
}
//導向不同的頁面
finally {
if(hasMore)
servletResponse.sendRedirect("faces/AttachFile.jsp");
else
servletResponse.sendRedirect("faces/Schedule.jsp");
}
}
}
|
1. 前面的取得 SessionBean1 及 ApplicationBean1，看個人需要，如果你需要取得 JSF 內的 SessionBean 及 ApplicationBean，可以參考這個用法。
2. 最后的 servletResponse.sendRedirect 會根據前面的 JSP 頁面，是否有勾選 chkAdd 來決定是要回到前面的 JSP 頁面來繼續新增檔案，或是前往其它 JSF 頁面。
3. 請注意 faces/Schedule.jsp 前面的 faces ，如果不加可能可會出現 Cannot find FacesContext 的錯誤。