吃驚的發現這裡竟然整個5月都沒有新東西,快快上來補個KM。。。。。。
今天要介紹的是一個在網頁上好用的檔案上傳工具,叫做swfupload,看名字就知道他跟flash有關係,沒錯!!他就是一個用flash做的上傳工具,先來講他的功能跟特色。
簡單的說有幾點:
1.可以自己設定一次傳一個檔案,還是一次傳多個檔案
2.可以限定一個或多個可上傳的檔案型態,當然要不限定也是可以,比較常見的應用可能是限定上傳jpg,jpeg檔。當然,檔案型態的判別是用windows預設的識別方式-副檔名,這點有點可惜,不過沒辦法,M$就是不用mimetype辨識也打不到他
3.可以限定上傳的檔案大小、數量。這個應該也常用到,除了因為大部份ICP不會給你無止盡的使用空間外,台灣的寬頻水準也不容許你暢快的愛傳多大就傳多大
4.上傳檔案不換頁,可以一邊上傳一邊看上傳進度。所以這樣就不會發生使用者上傳時盯著白白的畫面發呆,或是看一個上傳中的gif檔也不知道到底傳完沒(誰中槍?)
5.一次傳一堆時可以知道哪個檔案傳成功,哪個檔案傳失敗,不會發生一個失敗,等於全部失敗的慘劇
使用上也相當簡單,在download的頁面下載最新版本的sample檔,解壓縮後,在demos的目錄裡面,依應用模式分了好幾個資料夾,找一個中意的,把他放到網頁上就對了!
拿我用的simpledemo版本來說,這個資料夾裡有index.php跟upload.php兩個檔。index.php是上傳介面,把這頁裡上傳的那塊完完整整的摳到我的頁面裡要用的位置,然後把upload.php、images資料夾、js資料夾放到同一個目錄裡,再摳一下他的css檔,最後在upload.php裡加上儲存檔案的php程式碼,這樣基本上上傳功能就做完了,啊哈哈哈好簡單!
好的,到這裡是基本功能,現在開始講一點進階的。
首先,這個範例的按鈕有點醜,所以我去摳了他的XPButtonNoText_61x22.png來當我的按鈕樣式放到images資料夾裡,然後在設定的地方,button_image_url改成XPButtonNoText_61x22.png,button_width、button_height也跟著改成適當的size。
file_types設定成限制網頁能直接顯示的圖片*.png;*.jpg;*.gif;*.swf,多個檔案類型指定時,用分號隔開。
file_post_name改成我自己的名稱,這個會影嚮到upload.php裡要用什麼名稱接收,如果file_post_name設abcde,upload.php裡就用$_FILES["abcde"]來接收
file_upload_limit改成20,表示一次最多只能上傳20個檔案,必竟我不是用在相簿管理……
然後我改成選完檔案不要直接上傳,而是等按了我自己的確定按鈕才能傳。在handlers.js裡的fileDialogComplete,把this.startUpload()拿掉,然後在我的確定按鈕下swfu.startUpload()
最後呢,我還把他的顯示訊息中文化了。。。在handlers.js裡面,所有progress.setStatus開頭的部份
改好上傳測試,一次OK,簡單到不能再簡單的了
忽然覺得這年代寫程式的人越來越不值錢了,因為大家都好愛供獻好用工具
正所謂google搜尋學得好,做好網頁沒煩惱XD
2011年6月15日 星期三
swfupload
訂閱:
文章 (Atom)