pCloud Partner Program

表單上傳檔案取得檔名問題

程式技術/Javascript 2011/05/18 20:40
views: 106061 times
在前端網頁上, 若要上傳檔案, 是利用一個 <input type=file>的標籤來進行的, 這個 UI 看起來的長像在不同瀏覽器會有不同的結果, 也因為這樣, WEB DESIGNER 常常需要做一些設計來美化及一致化這個長相.

這篇文章不是在討論這個上傳檔案的長相, 而是要探討在前端程式碼取出上傳檔案的名稱, 這個也在不同的瀏覽器有不同的結果, 尤其新的瀏覽器又增加了一些特異功能. (如隱藏路徑)

這樣一來, 若是要對上傳檔案名稱欄位取出做一些判斷的話, 可要注意這些狀況的差異, 這裡寫了個小程式, 取出 <input type=file>的值, 在不同瀏覽器下可以測出不同的結果, 連結在這裡:

http://sample.diary.tw/25

我們以上傳 C:\test\1.txt 為例, 在不同瀏覽器下的結果如下:

IE9:
用戶插入圖片


Firefox 4.01
用戶插入圖片


Google Chrome 5:
用戶插入圖片


Safari 5:
用戶插入圖片


從上面畫面的結果來看, 發現 IE9 及 Google Chrome 會有含路徑的檔名, 但會隱藏路徑, 而 Firefox 4.01及 Safari 5則只會出現檔名而已, 不會有路徑, 而 IE6, IE7, IE8 的狀況則是 IE8 會像 IE9 一樣, 但 IE7, IE6 則是真實的檔案路徑, 如下:

IE6:
用戶插入圖片


IE7:
用戶插入圖片


IE8:
用戶插入圖片


這樣就清楚啦!
top

TatterTools中的Flash Upload安全性問題

程式技術/TatterTools 2010/06/29 12:15
views: 219587 times
由於 flash 在 10版之後, 透過 flash upload 的安全性有提升了, 不能使用 javascript 去呼叫 flash 的 select upload file dialog box, 所以在 TatterTools 中的發表文章的上傳組件就會因此失效.

解決的方式其實也就是把 browser 的 flash 降級成 flash 9 的版本, 但這個很怪, 因為有新版 flash 不用, 要去用舊的, 而若是升到 flash 10 又要能上傳的話, 一個是 disable browser 的 flash 功能, 但這個也很怪, 另一個則是修改一下 TatterTools 的編輯後台中的 upload module 讓 flash 失效即可.

其實 TatterTools 後台, 使用 flash upload 可以做多檔 upload, 但若沒有透過 flash 的話, 則是走 web upload , 一次只能上傳一個檔案, 雖然會比較麻煩, 不過也算是還可以的解決方案.

需要修改的地方有兩個, 一個是在新發表文章的 /blog/owner/entery/post/index.php 調查其中關鍵字: hasRightVersion , 全文是:

var hasRightVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);

在下面加一行 hasRightVersion = false; 即可.

另一個位置是在修改文章的 /blog/owner/entry/edit/item.php , 一樣調查關鍵字 hasRightVersion, 一樣在偵測 flash version 後, 把該變數設為 false 即可.

修改好後, 在文章編輯後台的上傳區就會是單檔上傳的介面, 如下:
用戶插入圖片


這樣一來就可以順利使用單檔上傳, 也避開了 flash 10 版安全性問題了!
top




Nextbit Robin 5.2吋六核心智慧型手機 Microsoft Office 365 中文家用版PKC (無光碟)
ASUS華碩 AC1900 雙頻無線路由器 RT-AC68U 美國 VORNADO 533 渦流空氣循環機 (黑色)
御茶園 每朝健康綠茶(650mlx24入) 每朝健康 雙纖綠茶(650mlx24入)


 Waiting...