ASP.NET使用SWFUpload上傳檔案教學

前陣子有人提到這個上傳工具,小弟沒玩過就給它抓下來試試
SWFUpload可以支援多檔上傳功能,還不錯用,小弟分享一下試用的結果

首先要將官網的Demo Sample抓下來,如下所示：

SWFUpload下載網址：http://swfupload.googlecode.com
SWFUpload下載檔案：SWFUpload-Samples v2.1.0.Release.zip

在\SWFUpload Samples v2.1.0\demos\applicationdemo.net目錄裡有下列檔案

接下來只要修改Default這支程式就可以了..我只增加了儲存選取檔案的功能..

和清除目前選取檔案的功能..更多的功能就要自己去修改了...

asp.net(c#)

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>SWFUpload Revision v2.1.0 Application Demo (ASP.Net 2.0)</title> <link href="css/default.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="swfupload/swfupload.js"></script> <script type="text/javascript" src="js/handlers.js"></script> <script type="text/javascript"> var swfu; window.onload = function () { swfu = new SWFUpload({ // Backend Settings upload_url: "upload.aspx", // Relative to the SWF file post_params : { "ASPSESSID" : "<%=Session.SessionID %>" }, // File Upload Settings file_size_limit : "2048", // 2MB file_types : "*.jpg", file_types_description : "JPG Images", file_upload_limit : "0", // Zero means unlimited // Event Handler Settings - these functions as defined in Handlers.js // The handlers are not part of SWFUpload but are part of my website and control how // my website reacts to the SWFUpload events. file_queue_error_handler : fileQueueError, file_dialog_complete_handler : fileDialogComplete, upload_progress_handler : uploadProgress, upload_error_handler : uploadError, upload_success_handler : uploadSuccess, upload_complete_handler : uploadComplete, // Flash Settings flash_url : "swfupload/swfupload_f9.swf", // Relative to this file custom_settings : { upload_target : "divFileProgressContainer" }, // Debug Settings debug: false }); } </script> </head> <body> <form id="form1" runat="server"> <div id="header"> <h1 id="logo"><a href="../">SWFUpload</a></h1> <div id="version">v2.1.0 Beta</div> </div> <div id="content"> <h2>Application Demo (ASP.Net 2.0)</h2> <div id="swfu_container" style="margin: 0px 10px;"> <div> <button id="btnBrowse" type="button" style="padding: 5px;" onclick="swfu.selectFiles(); this.blur();"><img src="images/page_white_add.png" style="padding-right: 3px; vertical-align: bottom;" alt="Add Icon" />Select Images <span style="font-size: 7pt;">(2 MB Max)</span></button> <asp:Button ID="btnSave" runat="server" OnClick="btnSave_Click" Text="Save Select Images" Width="150px" /> <asp:Button ID="btnClear" runat="server" Text="Clear Select Images" OnClick="btnClear_Click" Width="150px" /></div> <div id="divFileProgressContainer" style="height: 75px;"></div> <div id="thumbnails"></div> </div> </div> </form> </body> </html>

Default.aspx.cs

using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using System.Collections.Generic; using System.IO; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { // Clear the user's session if (!IsPostBack) { Session.Clear(); } } protected void btnSave_Click(object sender, EventArgs e) { if (Session["file_info"] != null) { List<Thumbnail> thumbnails = Session["file_info"] as List<Thumbnail>; string UploadPath = Server.MapPath("upload/"); foreach (Thumbnail img in thumbnails) { FileStream fs = new FileStream(UploadPath + img.ID + ".jpg", FileMode.Create); BinaryWriter bw = new BinaryWriter(fs); bw.Write(img.Data); bw.Close(); fs.Close(); } Session.Clear(); } } protected void btnClear_Click(object sender, EventArgs e) { Session.Clear(); } }

執行結果：

參考網址：http://swfupload.org/

推到 Twitter!

推到 Plurk!

2008/7/16 20:27| 閱讀數 : 22399 | 2 人收藏 4 人推薦 我要推薦 | 15 Comments | 文章分類 : ASP.NET ASP.NET(FileUpload) JavaScript | 訂閱

關連文章

回覆

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by lu on 2008/7/30 下午 04:45 回覆

想請問一下
儲存上傳的照片會被壓縮
要怎麼樣才能控制壓縮的大小呢??
感謝您!!!!

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by puma on 2008/7/30 下午 05:05 回覆

你試試在upload.aspx.cs的大約36,37行有寬高可以設定(預設為100)

ex:

int target_width = 300;
int target_height = 300;

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by lu on 2008/7/30 下午 05:50 回覆

喔喔了解了~謝謝!!
不過還有點問題想請教
所以儲存圖片時就會儲存壓縮完的size

要如何才能讓預覽圖維持在100,100
但真正儲存的圖是原大小

麻煩你了^^"

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by nana on 2008/7/31 下午 03:58 回覆

想請問你
它的上傳寫法是先存入MemoryStream
再把它讀出來，這樣很佔用Memory，
想請問你有別的方法嗎??

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by puma on 2008/7/31 下午 04:20 回覆

to nana:

它會先存入MemoryStream..原本sample code就是這樣...

當然要如何暫存圖片資料方法有很多種啦..要視需求而改...

你也可以不存在MemoryStream.可以暫存在一個temp資料夾裡..

但多人使用上傳時,就要小心temp的名命規則..可用guid...

還有使用者不小心離線時,,暫存temp的刪除機制...很多要考量的...

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by nana on 2008/8/1 上午 10:49 回覆

我有試過一個方法，把ms(MemoryStream)
改寫成一個路徑讓它把檔案存在那邊，可是會出現500的錯誤，
我又去察看他的500錯誤，發現他寫的是Internal Server error...
然而到這邊我就不懂為什麼會這樣了，我確定那資料夾是沒有問題的，不管是權限或什麼方面，所以我還在研究中。

另外還想請教一件事情，你說：暫存在一個temp資料夾
那是什麼樣的一個技術呢?可以麻煩你說清楚一點嗎??
謝謝你~

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by puma on 2008/8/1 上午 11:27 回覆

to 所有的人:

其實要改成直接存至檔案...還有很多東西要講的....

大家如果有任何問題..大家可以和我一起研究呀...

給大家我的聯絡方式..

msn:hent@pchome.com.tw

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by 小沙 on 2008/8/10 上午 10:48 回覆

如果我想上传的是非图片文件，该怎么修改啊!
谢谢了哈！

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by yamesz on 2008/8/21 下午 11:22 回覆

剛剛測試半天原來不支援火狐阿

改用ie 就都ok囉

算是缺點吧火狐越來越多人用囉

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by update on 2008/12/26 下午 12:11 回覆

为何出现这个错误？
编译器错误消息: CS0246: 找不到类型或命名空间名称“Thumbnail”(是否缺少 using 指令或程序集引用?)

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by digitalwow on 2009/7/17 下午 06:07 回覆

bookmark 這一頁很久了.直到現在才拿來study. 現在版本是 2.2. 依您的方法.設定後. 去run default.aspx (原始檔.).但發生錯誤.

行 14
字元 4
錯誤:'SWFUpload' 未定義
字碼:0

這.....要從那查起.?

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by digitalwow on 2009/7/17 下午 08:34 回覆

..sorry .原來是 js 及 css 路徑不對...
呵...

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by 蛤? on 2009/11/26 上午 11:10 回覆

大大，SWFUpload不支援中文檔名

這部份有辦法解決嗎？

大大你的範例，我開了之後，select image的button按下去都沒反應

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by 蛤? on 2009/11/26 下午 04:24 回覆

大大，我研究了半天，還是不行

出現swfu是null或不是一個物件

後來把他精簡掉變成下面這樣

var swfu;

window.onload = function () {

swfu = new SWFUpload({

upload_url : upload.aspx,

flash_url : swfupload.swf,

custom_settings : {upload_target : "divFileProgressContainer"} ,

file_size_limit : "20480" }); };

結果變成 ie 的cpu一直衝到35~60之間

但按下button還是沒有效果

# re: ASP.NET使用SWFUpload上傳檔案教學, Posted by Ethan on 2010/7/19 下午 03:53 回覆

請問
點第一個button
應該會執行swfu.selectFiles()
請問大大這個函式在哪?
因為點了之後都沒有反應

發表回覆

標題: *
姓名: *
Email: (將不會被顯示)
Url:
回覆: *: Remember Me!登入後使用進階評論

Please add 4 and 4 and type the answer here:

請輸入驗證碼:

用BloggerAds 替自已加薪

F6 Team

"用心" by puma

標籤

最新回覆