背景:項(xiàng)目中涉及到表單數(shù)據(jù)提交塔拳,其中還包含有圖片欠橘。
關(guān)于如何保存圖片,我一開始有兩種思路:
- 將圖片轉(zhuǎn)換成二進(jìn)制字節(jié)流赞季,然后保存到數(shù)據(jù)表當(dāng)中(項(xiàng)目中用的是Oracle數(shù)據(jù)庫愧捕,保存二進(jìn)制字節(jié)流的那個(gè)字段定義成blob類型就可以了)。
- 將圖片上傳到服務(wù)器碟摆,然后數(shù)據(jù)表中保存的是文件名(如 eakon.jpg)。只保存文件名是出于這樣的考慮:因?yàn)楝F(xiàn)在只給我們項(xiàng)目組分配了一臺(tái)服務(wù)器叨橱,以后圖片可能要放到專門的文件服務(wù)器上典蜕,如果現(xiàn)在把路徑也保存到數(shù)據(jù)表當(dāng)中去的話我怕到時(shí)候萬一項(xiàng)目的部署方式一改就會(huì)牽扯到很多東西,所以就直接保存?zhèn)€文件名罗洗。如果要將圖片展示在前臺(tái)頁面上的話愉舔,就在業(yè)務(wù)層拼接一下絕對(duì)路徑/相對(duì)路徑。
一開始我選擇了第一種方式伙菜,即將圖片轉(zhuǎn)換成二進(jìn)制字節(jié)流編碼然后存到數(shù)據(jù)表的大數(shù)據(jù)字段當(dāng)中去轩缤,后來也是考慮到項(xiàng)目后期部署的問題,以及圖片展示的問題--------假如要將圖片展現(xiàn)在前臺(tái)頁面,首先要將該圖片對(duì)應(yīng)的存儲(chǔ)在數(shù)據(jù)表中二進(jìn)制數(shù)據(jù)取出來火的,取出來之后還要涉及到一系列的數(shù)據(jù)格式轉(zhuǎn)換問題壶愤。因?yàn)椴荒苤苯訉⒍M(jìn)制數(shù)據(jù)直接傳到j(luò)sp頁面,在此之前還要對(duì)其進(jìn)行處理馏鹤。覺得比較麻煩征椒,所以后來選擇了第二種方式來對(duì)圖片進(jìn)行上傳的操作。
一開始在Action中老是獲取不到上傳的文件湃累,一時(shí)不知道是什么原因勃救。后來把圖片上傳涉及到的代碼重新檢查了一下,然后修改了一下攔截器又能上傳圖片了治力,暫時(shí)沒找到原因在哪里蒙秒。先總結(jié)一下在上傳文件(這里只針對(duì)圖片文件,其他文件可能還涉及到設(shè)置編碼字符集的問題宵统,以后遇到了再總結(jié))的過程中需要注意的地方晕讲。
我這里用的是jsp表單提交的方式,沒有使用Ajax
jsp頁面里面需要注意的地方:
- 在form標(biāo)簽中 enctype 屬性應(yīng)該設(shè)置為 "multipart/from-data"
- 文件域的name和后臺(tái)Action中接收文件的變量名要一致
- 提交按鈕應(yīng)為 submit 標(biāo)簽
Struts2配置時(shí)需要注意的地方
一定要配置一個(gè)屬性指定文件存放的臨時(shí)目錄榜田。如果是使用xml文件進(jìn)行配置的話益兄,需在Struts.xml文件中進(jìn)行如下配置:
關(guān)于攔截器
我是在action標(biāo)簽中嵌了一個(gè)攔截器,最好是用<interceptor-ref name="" class="" ></interceptor-ref>的方式定義攔截器然后添加到攔截器棧里面去箭券,需要用的時(shí)候再到action里面引用比較好净捅,可以做到代碼復(fù)用
關(guān)于處理文件上傳的Action
- 需要定義一個(gè)File類型的變量來接收從前臺(tái)傳過來的文件(其實(shí)文件從前臺(tái)傳過來之后辩块,會(huì)保存在我們定義的臨時(shí)存放目錄里面蛔六,然后在完成了Action中對(duì)應(yīng)的方法之后系統(tǒng)會(huì)把臨時(shí)目錄里面的臨時(shí)文件給清除)。
- 比如說 File 類型的變量名字為 File eakon废亭。我們可以再定義三個(gè)String類型的變量国章,分別為 title, eakonFileName, eakonContentType《勾澹可以獲取到 文件標(biāo)題液兽、文件名以及文件的類型(必須引入上面的兩個(gè)jar包,并且按照 文件類型變量名+FileName, 文件類型變量名+ContentType才能獲取到文件名以及文件類型)掌动。但是要記得生成對(duì)應(yīng)的get/set方法四啰。
只要注意以上幾點(diǎn),上傳圖片的功能基本就能實(shí)現(xiàn)了(有一些具體的業(yè)務(wù)代碼就不貼了粗恢,只貼一個(gè)主要的函數(shù))柑晒。
在前臺(tái)頁面輸入需要提交的信息:
點(diǎn)擊保存之后觸發(fā)對(duì)應(yīng)的action,在調(diào)用對(duì)應(yīng)的Action中的函數(shù)之前眷射,首先會(huì)被攔截器攔截匙赞,判斷上傳的文件類型以及大小是否符合定義的要求佛掖,如果符合,那就進(jìn)入對(duì)應(yīng)的method進(jìn)行處理涌庭。
下面這個(gè)函數(shù)的功能就是將臨時(shí)目錄下面的文件里面的內(nèi)容復(fù)制到指定路徑下的文件當(dāng)中
@Override
/*將文件保存到路徑為fileName的地方芥被,其中fileName包括了文件名以及路徑
* @param file 從前臺(tái)獲取到的文件
* @param filePath 路徑+文件名
* */
private static final int BUFFER_SIZE = 16*1024;//文件緩沖區(qū)大小
public void copyAndSaveFile(File file,String filePath) throws IOException{
File dst = new File(filePath);
InputStream in = null;
OutputStream out = null;
try{
in = new BufferedInputStream(new FileInputStream(file),BUFFER_SIZE);
out = new BufferedOutputStream(new FileOutputStream(dst),BUFFER_SIZE);
byte[] buffer = new byte[BUFFER_SIZE];
int len = 0;
while( (len=in.read(buffer)) > 0){
out.write(buffer, 0, len);
}
}catch(Exception e){
e.printStackTrace();
}finally{
if(null != in){
try{
out.close();
}catch(IOException e){
e.printStackTrace();
}
}
}
}
經(jīng)過上述處理,文件已經(jīng)保存到了目標(biāo)文件夾下面:
在數(shù)據(jù)表中的對(duì)應(yīng)字段脾猛,只保存了文件名:
如果需要將圖片在前臺(tái)頁面顯示出來撕彤,只需取出對(duì)應(yīng)的文件名,然后加上訪問路徑傳到前臺(tái) img 標(biāo)簽的src屬性即可