HTTP斷點續傳控件-ASP.NET開發文檔-Xproer.HttpUploader3


版權所有 2009-2012 武漢命運科技有限公司
保留所有權利
官方網站: http://www.ncmem.com/
聯系信箱:1085617561@qq.com

聯系QQ:1085617561

更新記錄:

更新時間

描述

2012-2-16

增加斷點續傳章節。

2012-2-17

增加自動拼接路徑章節

 

1.      界面

拖拽面板界面。

說明:支持文件和文件夾拖拽。如果用戶拖拽的是文件夾,則控件將會讀取此文件夾下的所有文件,包括所有子文件夾中的文件。

 

MD5計算進度

 

 

MD5計算完畢

 

 

上傳中

 

 

上傳完成界面

 

 

1.      搭建測試環境

搭建測試環境步驟如下:

1.搭建Web服務器。IIS,Apatch, Apache Tomcat 6

2.修改index.html上傳地址

 

2.      整合到現有系統中

主要步驟:

  1. 上傳控件相關文件。一般是整個HttpUploader文件夾
  2. 修改cab文件下載地址
  3. 修改classid和codebase地址
  4. 設置服務器編碼
  5. 修改文件上傳地址
  6. 在引用頁面調用

 

2.1.   上傳控件相關文件

上傳HttpUploader文件夾

asp.net//請根據項目類型上傳相應的文件夾,如果是PHP項目則上傳PHP文件夾,如果是ASP項目則上傳asp文件夾

HttpUploader

說明:

請不要手動解壓HttpUploader.cab文件,請將完整的HttpUploader.cab文件上傳到服務器中。IE瀏覽器會自動安裝CAB。CAB文件相當於是一個自動安裝控件的腳本。

 

2.2.   修改文件上傳地址

打開combinbox.js文件,找到Config配置代碼

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

修改UrlCreate,UrlPost,UrlProcess,UrlComplete,UrlList,UrlDel。

注意:

     Url必須為完整地址,請勿使用相對地址。

     UrlCreate = http://www.ncmem.com/upload.aspx//正確地址

     UrlCreate = /upload.aspx//錯誤地址

如果希望使用相對地址,請參考自動拼接路徑章節

 

2.3.   修改CAB文件下載地址

打開combinbox.js文件,找到Config配置代碼

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

2.4.   修改classid和codebase地址

打開combinbox.js文件,修改控件的classid及codebase地址。

     this.ActiveX = {

         "Uploader"    : "Xproer.HttpUploader4"//這里的Xproer要改為單獨生成的名稱。

         , "Partition" : "Xproer.HttpPartition4"//這里的Xproer要改為單獨生成的名稱。

     };

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

說明:

     為了避免與其它公司的控件產生沖突,每個控件的classid值都不相同。在購買產品后,我們會為每個公司單獨生成序列號。

     當控件升級(版本號變化)或CAB文件地址更改,必須修改codebase的地址。否則用戶的IE瀏覽器將無法正常加載控件。

     請確保codebase的地址與示例中的地址一致,version字符不能丟失,版本號中間不能有空格。

如果公司名稱是QQ,則ActiveX的ProjID如下:

QQ.HttpUploader

QQ.HttpPartition

 

2.5.   設置服務器編碼

打開HttpUploader.js文件,找到Config配置代碼

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

修改EncodeType的值。EncodeType為文件上傳頁面的編碼,此編碼必須與網站保持一致。因為Http文件上傳控件會根據此編碼類型來對中文文件名稱進行編碼處理。示例如下:

如果網站的編碼是GB2312,EncodeType = "GB2312"

如果網站的編碼是UTF-8,EncodeType = "UTF-8"

 

2.6.   在頁面中引用

1.添加頭文件

2.添加引用代碼

 

在<head></head>標簽中間添加下列代碼

    <link href="css/HttpUploader.css" type="text/css" rel="Stylesheet"/>

    <script type="text/javascript" src="js/FileLister.js"></script>

    <script type="text/javascript" src="js/HttpUploader.js"></script>

    <script type="text/javascript" src="js/combinbox.js"></script>

    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>

    <script language="javascript" type="text/javascript">

    var cbItemLast = null;

    var cbMgr = new CombinBoxMgr();

 

    $(document).ready(function()

    {

         cbMgr.LoadInControl("FilePanel");//在指定的DIV中加截控件

         cbMgr.Init();

    });

</script>

 

在<body></body>標簽中間的適當位置添加下列代碼:

<div id="FilePanel"></div>

 

3.      自動拼接路徑

如果域名會經常變動不是固定域名,可以使用自動拼接路徑函數InitPath()來簡化控件布署。

以下示例演示如何使用自動拼接路徑

修改combinbox.js中的路徑

     this.Config = {

         "EncodeType"       : "UTF-8"

         ,"CompanyLicensed" :"武漢命運科技有限公司"

         , "FileFilter"     : "*"//文件類型

         , "AppPath"        : ""//網站虛擬目錄名稱。子文件夾 web

         , "CabPath"        : "HttpUploader/HttpUploader.cab#version=2,4,11,45688"//CAB文件地址。使用自動拼接路徑時只寫CAB地址的相對路徑。

         , "PostUrl"        : "upload.aspx"//文件上傳路徑,使用自動拼接路徑時只寫上傳地址的相對路徑

         , "ClsidDroper"    : "4D2454F8-EB25-465f-B867-C2A3E9F3D4B4"//拖拽控件

         , "ClsidUploader"  : "7AAE6FD3-C2F2-49d5-A790-1103848B3531"//文件上傳控件

         , "ClsidPartition" : "6F3EB4AF-FC9C-4570-A686-88B4B427C6FE"//文件選擇控件

     };

在Load函數中調用InitPath

     //在外部調用。

     this.Load = function()

     {

        this.InitPath();//自動拼接路徑

    }

 

在頁面引用代碼中設置AppPath值

<script type="text/javascript" language="javascript">

    var imgUploader = new ImageUploader();

    imgUploader.Config["AppPath"] = "/www/";//設置網站目錄

     imgUploader.Load();

 

     window.onload = function()

     {

         imgUploader.Init();

     };

</script>

 

調用InitPath()后,PostUrl和CabPath將會被自動拼接成下列字符串

PostUrl = http://www.ncmem.com/upload.aspx

CabPath = http://www.ncmem.com/HttpUploader/HttpUploader.cab#version=2,4,11,45688

 

1.      控件升級

一般情況下控件升級后只需要更新服務器的HttpUploader.cab文件和修改HttpUploader.js中的控件版本號。用戶打開瀏覽器時IE會自動提示用戶安裝最新的控件。效果圖如下:

 

主要步驟如下:

1.重新上傳HttpUploader.cab文件

2.修改HttpUploader.js中的控件版本號。

 

1.1.   重新上傳HttpUploader.cab文件

在控件升級后,我們會將最新的HttpUploader.cab文件發給開發人員。開發人員只需要將最新的HttpUploader.cab文件上傳到服務器即可。

 

1.2.   修改HttpUploader.js中的控件版本號

一般情況下,控件更新后版本號也會更新。在重新上傳HttpUploader.cab后,需要修改控件的版本號。

請找到類似以下代碼后,修改version后面的版本號。

     this.Config = {

         "EncodeType"       : "UTF-8"

         ,"CompanyLicensed" :"武漢命運科技有限公司"//請勿修改此處授權名稱,如果需要修改請與我們聯系。

         , "FileFilter"     : "*"//文件類型。所有類型:*。自定義類型:jpg,png,gif,bmp

         , "AllowMultiSelect": 0//多選開關。1:開啟多選。0:關閉多選

         , "AppPath"        : ""//網站虛擬目錄名稱。子文件夾 web

         , "CabPath"        : "http://www.ncmem.com/httpUploader/HttpUploader.cab#version=2,4,11,45688"//CAB文件地址

         , "PostUrl"        : "http://localhost:1591/asp.net/upload.aspx"//文件上傳路徑

         , "ClsidDroper"    : "4D2454F8-EB25-465f-B867-C2A3E9F3D4B4"//拖拽控件

         , "ClsidUploader"  : "7AAE6FD3-C2F2-49d5-A790-1103848B3531"//文件上傳控件

         , "ClsidPartition" : "6F3EB4AF-FC9C-4570-A686-88B4B427C6FE"//文件選擇控件

     };

 

2.      用戶接口

2.1.   配置上傳地址

文件上傳地址一般都在combinbox.js文件中配置

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

2.2.   設置服務器編碼方式

服務器編碼設置一般都在combinbox.js文件中配置

     this.Config = {

         "EncodeType"           : "GB2312"//設置上傳編碼。必須與網站配置相同。建議在HttpUploader.js中設置,這樣可以在多個頁面引用,而不需要再次設置。

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

2.3.   設置允許上傳的文件類型

文件上傳地址一般都在combinbox.js文件中配置

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

假設我們設置允許上傳的文件類型為jpg,bmp,png,gif,則效果圖如下:

 

 

2.4.   設置允許上傳的文件大小

在線字節計算工具:http://www.beesky.com/newsite/bit_byte.htm

允許上傳的文件大小一般都在combinbox.js文件中配置

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

2.5.   設置文件塊大小

在線字節計算工具:http://www.beesky.com/newsite/bit_byte.htm

文件塊大小一般都在combinbox.js文件中配置。

一般情況下推薦設置為128KB,這是為了保證在網絡環境不穩定的情況下,控件能夠正常上傳。如果用戶的網絡環境比較穩定,可適當調大這個值。

     this.Config = {

         "EncodeType"           : "GB2312"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型。所有類型:*。自定義類型:jpg,bmp,png,gif,rar,zip,7z,doc。設置允許上傳的文件類型,使用英文逗號(,)分隔。

         , "FileSizeLimit"      : "0"//自定義允許上傳的文件大小,以字節為單位。表示不限制。

         , "FilesLimit"         : 0//文件選擇數限制。表示不限制

         , "AllowMultiSelect"   : 1//多選開關。:開啟多選。:關閉多選

         , "RangeSize"          : 131072//文件塊大小,以字節為單位。必須為64KB的倍數。推薦大小:128KB。

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,7,41,55266"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"//在服務端創建一個文件信息標識地址。

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"//文件塊上傳地址

         , "UrlProcess"         : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_process.aspx"//文件上傳進度信息記錄地址。

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"//文件上傳完成狀態記錄地址。

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"//文件列表地址(演示包含已上傳完成的文件和未上傳完成的文件)。

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"//刪除文件地址

         , "ClsidDroper"        : "1E7C9F05-406F-4de6-8348-53AD96A79600"

         , "ClsidUploader"      : "65D197E1-9CBC-441a-98BC-B6431C6E4617"

         , "ClsidPartition"     : "5412F8C8-BACE-430e-9BD8-4E75F0E21E03"

     };

 

5.4.   設置附加信息

附加信息的作用就是在上傳圖片的同時向服務器提交額外的字段信息。比如當用戶向服務器上傳截圖時,服務器需要知道是哪位用戶上傳的截圖,這時可以將用戶ID添加到附加信息中,這樣服務器在獲取截圖信息的同時也能夠根據附加信息知道是哪位用戶上傳的截圖。

客戶端:

uploaderMgr.Fields["UserName"] = "test";

服務端:

string fname = Request.Form["UserName"];

 

開發人員可以根據自已的業務需求來擴展附加信息:

客戶端:

uploaderMgr.Fields["f1"] = "f1";

uploaderMgr.Fields["f2"] = "f2";

uploaderMgr.Fields["f3"] = "f3";

uploaderMgr.Fields["f4"] = "f4";

uploaderMgr.Fields["f5"] = "f5";

服務端(ASP.NET):

string f1 = Request.Form["f1"];

string f1 = Request.Form["f2"];

string f1 = Request.Form["f3"];

string f1 = Request.Form["f4"];

string f1 = Request.Form["f5"];

 

5.5.   上傳本地文件

請要步驟如下:

1.調用AddFile函數添加本地文件,注意路徑需要使用雙斜框(\\)

2.調用PostFirst函數開始上傳文件。

<script type="text/javascript" language="javascript">

    var uploaderMgr = new HttpUploaderMgr();

    uploaderMgr.Load();//加載控件

    uploaderMgr.AddFile("D:\\Soft\\QQ2010.exe");

    uploaderMgr.PostFirst();

</script>

 

6.      斷點續傳

HttpUploader會以POST方式每次向服務器提交128KB的文件數據和以下附加信息字段

字段名稱

類型

長度

可能的值

說明

complete

string

5

true,false

表示文件數據塊已傳完

FileName

string

255

d:\\soft\\QQ2010.exe

上傳的文件名稱。包含本地文件路徑。

FileSize

long

 

1000

文件總大小,以字節為單位

RangePos

long

 

0

文件塊索引。服務根據此值來保存文件塊數據。

md5

string

32

4b213776e6f72c3daa727524f8234115

文件MD5,用來驗證服務器是否存在相同文件。

 

如果開發人員希望用戶關閉IE后再次打開IE時,用戶仍然能夠繼續上傳關閉IE前未上傳完成的文件,開發人員應該將上面的相關信息保存在數據庫中。在打開頁面時從數據庫讀取數據然后調用AddResumeFile方法,添加需要續傳的文件。

以下示例演示從100字節的位置開始續傳QQ2010.exe文件

<script type="text/javascript" language="javascript">

    var uploaderMgr = new HttpUploaderMgr();

    uploaderMgr.Load();//加載控件

     //添加續傳文件

    uploaderMgr.AddResumeFile("D:\\Soft\\QQ2010.exe","100","10%");

    uploaderMgr.PostFirst();

</script>

 

5.1.   IIS的設置


 

開啟保持HTTP連接


 

1.      JavaScript對象
1.1.   HttpUploader對象
類型:JavaScript
文件上傳對象的包裝類,用戶在實際的項目中只需要創建HttpUploader對象,然后通過HttpUploader對象就可以進行文件上傳操作。
 
語法:
JavaScript(聲明)
function HttpUploader() { }
 
方法
 
名稱
說明

 
Ready
指示文件上傳對象准備完畢

 
Post
開始上傳文件

 
Stop
停止文件上傳

 
PostNext
繼續傳輸上傳隊列中的下一個文件
 
Ready方法
將上傳任務狀態設置為准備狀態。
Post方法
開始上傳文件。
說明:此函數將會自動實現斷點續傳功能。如果當前任務文件只上傳了一半,則在下次開始時XSUploader組件將會自動定位到上次上傳的位置繼續上傳數據。
Stop方法
停止上傳任務。
PostNext方法
繼續上傳隊列中下一個任務。
 
屬性
 
名稱
說明

 
pMsg
消息對象。

 
pProcess
上傳進度條對象

 
pPercent
上傳進度百分比。

 
pButton
控制按鈕

 
TimeOutID
定時器

 
Ext
文件擴展名。例:

 
LocalFile
不包含路徑的文件名稱。例:qq.exe

 
LocalFileName
包含完整路徑的本地文件名稱。例:C:\qq.exe

 
FileLength
文件大小。以字節為單位。
1GB=1024MB
1MB=1024KB
1KB=1024byte
 
1.2.   HttpUploaderMgr對象
類型:JavaScript
上傳文件管理類。
 
方法
AddFile方法
添加一個文件到上傳對列中
語法:
void AddFile(fid);
參數:
     fid
新上傳任務的唯一文件ID,此ID用來區域不同的上傳任務。
 
AddFeidl方法
 
AddResumeFile方法
添加一個續傳文件。
語法:
this.AddResumeFile = function(filePath, postedLength, postedPercent, md5)
參數:
filePath
包含本地文件路徑的文件名稱。示例:D:\\Soft\\QQ2010.exe
postedLength
已上傳文件大小(以字節為單位),即續傳起點。示例:10020
說明:此值一般保存在數據庫中。在頁面加載時可從數據庫讀取此值然后傳給控件。
postedPercent
已上傳百分比。示例:50%
md5
文件MD5。一般從服務器讀取。
 
PostFirst方法
開始上傳隊列中的第一個文件。
語法:
void PostFirst()
 
Exist方法
檢查上傳隊列中是否存在指定文件。
說明:此函數是根據本地文件的完整路徑來檢測的。
bool Exist();
返回值:
     true
表示存在。
     false
不存在。
SetFileFilter方法
設置過濾的文件類型。
語法:
void SetFileFilter(filter)
參數:
     filter 文件類型字符串。由逗號分隔。示例:exe,jpg,php
 
屬性
Fields屬性
上傳時附加的額外信息。
 
注意:此屬性暫時不支持中文字符串。
 
以下示例演示上傳時添加用戶名和密碼的額外信息:
var uploaderMgr = new HttpUploaderMgr();
uploaderMgr.Fields["UserName"] = "test";
uploaderMgr.Fields["UserPass"] = "test";
 
Config屬性
提供全局配置信息。
 
語法:
     this.Config = {
     "EncodeType": "UTF-8"
         ,"CompanyLicensed":"北京新穎網絡"
         , "FileFilter": "*"//文件類型
         , "AppPath": ""//網站虛擬目錄名稱。子文件夾 web
         , "CabPath": "/products/http-uploader/demo2/HttpUploader.cab#version=2,4,11,45688"
         , "PostUrl": "/asp.net/upload.aspx"
         , "ClsidDroper": "4D2454F8-EB25-465f-B867-C2A3E9F3D4B4"
         , "ClsidUploader": "7AAE6FD3-C2F2-49d5-A790-1103848B3531"
         , "ClsidPartition": "6F3EB4AF-FC9C-4570-A686-88B4B427C6FE"
     };
 
EncodeType值
服務器編碼方式。
此屬性必須和web.config配置文件對應。
 
如果服務器端編碼方式是UTF-8
<globalizationrequestEncoding="utf-8"responseEncoding="utf-8"/>
則客戶端也必須是UTF-8
var uploaderMgr = new HttpUploaderMgr();
uploaderMgr.Config["EncodeType"] = "UTF-8";
 
如果服務端編碼方式是GB2312
<globalizationrequestEncoding="gb2312"responseEncoding="gb2312"/>
則客戶端也必須是GB2312
var uploaderMgr = new HttpUploaderMgr();
uploaderMgr.Config["EncodeType"] = "GB2312";
 
PostUrl值
接收處理上傳文件的URL。
 
2.      ActiveX對象
2.1.   Xproer.HttpDroper對象
CLSID 7193B258-CA68-4eee-A64A-43C7E3BD1857
類型:ActiveX
文件拖放面板,為用戶提供文件的拖放功能。
 
事件
OnFileDrop事件
文件拖放事件。當用戶從資源管理器向拖放面板中拖放文件時此事件將會自動被調用。
 
示例
<HTML>
<HEAD>
<TITLE>New Page</TITLE>
</HEAD>
<BODY>
 
<OBJECT ID="FilePanel1" WIDTH=192 HEIGHT=192 CLASSID="clsid: AF145FF6-EF91-4C91-BD85-D4ECCA224D27" DATA="DATA:application/x-oleobject;BASE64,P0yJ/coEwUiWnGww8Tau4AADAADYEwAA2BMAAA==">
</OBJECT>
<div id="divFileLister"></div>
<script language="javascript" type="text/javascript">
     var obj = document.getElementById("FilePanel1");
     obj.OnFileDrop = EventFileDrop;
     function EventFileDrop()
     {
         var lister = document.getElementById("divFileLister");
         var list = obj.GetSelectedFiles();//獲取選擇的文件
         for (var index = list.lbound(1); index <= list.ubound(1); ++index)
         {
              lister.innerHTML += "<p>文件名:" + list.getItem(index) + "</p>";
         }
     }
</script>
</BODY>
</HTML>
2.2.   Xproer.HttpPartition對象
CLSID BC5E2E5D-49E2-4d34-A606-902640DB92AC
類型:ActiveX
多文件選擇對象。彈出一個文件選擇對話框,為用戶提供選擇多個文件的功能。
方法
 
名稱
說明

 
ShowDialog
彈出文件選擇對話框

 
GetSelectedFiles
獲取用戶選擇的文件列表
 
GetSelectedFiles方法
獲取用戶選擇的文件列表數組。
 
屬性
 
名稱
說明

 
FileFilter
允許上傳的文件擴展名。使用逗號分隔不同類型名稱。
允許上傳指定類型文件示例:jpg,gif,png,bmp,doc,exe,txt
如果允許上傳任意類型示例:*
 
 
示例
下面的代碼示例將會創建一個文件選擇框,並彈出用戶所選擇的文件名稱。
JavaScript:
<script type="text/javascript" language="javascript">
     function ShowSelectFileDlg()
     {
         var manager = new HttpUploaderMgr();
         var obj = new ActiveXObject(manager.ActiveX["Partition"]);;//創建文件選擇對話框
 
         if (!obj.ShowDialog()) return;
         var list = obj.GetSelectedFiles();//獲取用戶選擇的文件
         if (list == null) return;
         if (list.lbound(1) == null) return;
 
         for (var index = list.lbound(1); index <= list.ubound(1); index++)
         {
              if (!manager.Exist(list.getItem(index)))
              {
                   manager.AddFile(list.getItem(index));
              }
         }
         manager.PostFirst();
     }
</script>
2.3.   Xproer.HttpUploader對象
CLSID 33A128F3-9CA3-4a7f-A1FE-1DB6BF5156AA
類型:ActiveX
HTTP文件上傳對象,負責文件具體的上傳和續傳工作。
 
屬性
 
類型
名稱
說明

 
int
FileID
文件ID。必須唯一。

 
long
PostedLength
已上傳的文件大小。以字節為單位。最大約為2G大小
此參數主要提供給斷點續傳功能使用。
如果指定了此參數,則控件將會從此位置處開始上傳文件。

 
string
LocalFile
包含完整路徑的本地文件名稱。例:D:\QQ.exe

 
string
FileLength
文件大小,以字節為單件的字符串。

 
string
FileSize
文件大小,格式化后的文件大小字符串。示例:10MB,10.20MB,3KB

 
string
MD5
文件MD5值。一般在續傳時用到。
 
事件
 
名稱
說明

 
OnComplete
在文件上傳完成時發生

 
OnPost
每當向服務器傳輸成功一部分數據時發生

 
OnStop
在文件上傳停止時發生

 
OnError
在文件上傳出現錯誤時發生
 
OnComplete事件
傳輸完成事件,當文件成功上傳完畢后,系統將會調用此方法 
參數:
     arguments[0]
         文件ID。
OnPost事件
傳輸數據事件。每當HttpUploader插件成功向服務器傳輸二進制數據后將觸發此事件。
參數:
obj
HttpUploader JS對象
speed
傳輸速度
postedLength
已上傳字節
percent
已上傳百分比。
time
剩余完成時間
 
OnStop事件
傳輸停止事件,當上傳任務停止時系統將會自動調用此方法
參數:
arguments[0]
文件ID。
OnError事件
傳輸錯誤事件,當傳輸出現錯誤時系統將會自動調用此事件。
參數:
arguments[0]
文件ID。
arguments[1]
錯誤碼
0
連接服務器錯誤
1
發送數據錯誤
2
接收數據錯誤
3
未設置本地文件
4
本地文件不存在
5
打開本地文件錯誤
6
不能讀取本地文件
7
公司未授權
8
未設置IP
9
域名未授權
10
文件大小超過限制
200
無打打開文件
201
文件大小為0
 
示例
下面的代碼將會創建一個上傳項,並將本地C盤下的myfile.txt文件上傳到服務端,並以myfile.txt保存。
JavaScript
var upFile = new FileUploader(1);//這里創建了一個文件上傳任務,並將文件ID設置為1
upFile.ATL.PostUrl = "http://www.ncmem.com/upload.aspx";//設置上傳地址
upFile.ATL.LocalFileName = "C:\\myfile.txt";//設置要上傳的本地文件
//設置事件,這些事件必須設置,否則上傳任務將無法執行
upFile.ATL.OnComplete = function() { }
upFile.ATL.OnPost = function() { }
upFile.ATL.OnStop = function() { }
upFile.ATL.OnError = function() { }
upFile.Post(); //開始上傳
 
3.      UI模板
您可以根據實際需求來修改以下模板。
 
HTML:
<div class="UploaderItem" id="UploaderTemplate">
     <div class="UploaderItemLeft">
         <div class="FileName top-space">HttpUploader程序開發.pdf</div>
         <div class="ProcessBorder top-space">
              <div class="Process"></div>
         </div>
         <div class="PostInf top-space">已上傳:15.3MB 速度:20KB/S 剩余時間:10:02:00</div>
     </div>
     <div class="UploaderItemRight">
         <a class="Btn" href="javascript:void(0)">取消</a>
         <div class="ProcessNum">35%</div>
     </div>
</div>
 
4.      HTML示例
以下示例將會彈出一個對話框並將用戶選定的文件上傳到服務器中。
JavaScript:
<script type="text/javascript" language="javascript">
    function ShowSelectFileDlg()
    {
        var manager = new HttpUploaderMgr();
        var obj = new ActiveXObject(manager.ActiveX["Partition"]);
        if (!obj.ShowDialog()) return;//打開選擇文件對話框
       
        var list = obj.GetSelectedFiles();//獲取用戶選擇的文件
        if (list == null) return;
        if (list.lbound(1) == null) return;
        for (var index = list.lbound(1); index <= list.ubound(1); index++)
        {
           if (!manager.Exist(list.getItem(index)))
            {
                manager.AddFile(list.getItem(index));
            }
        }
        manager.PostFirst();
    }
</script>

 

 

1.      ASP.NET示例(demoAccess)

說明:

此示例支持1000G文件的續傳操作。

編碼:GB2312

 

主要配置步驟如下:

  1. 創建數據庫。
  2. 修改js/combinbox.js中的配置信息
  3. 運行demoAccess/index.htm文件

 

1.1.   文件列表

文件名稱

說明

db/ajax_complete.aspx

負責更新數據庫中文件項的完成狀態,將文件項的完成狀態設為已完成。

引用位置:在HttpUploader.js中的HttpUploader_Complete函數引用。

db/ajax_create_fid.aspx

負責向數據庫中添加一個新的文件項,並將新的文件項信息返回給客戶端。

引用位置:在HttpUploader.js中的HttpUploader_MD5_Complete函數中引用。

db/ajax_del.aspx

負責更新數據庫中文件項的刪除狀態,將文件項的刪除狀態設為已刪除。

引用位置:在FileLister.js中的FileItemRemove函數中引用

db/ajax_list.aspx

以JSON格式列出數據庫中所有未完成的文件列表

引用位置:在FileLister.js中的LoadData函數中引用。

db/ajax_post.aspx

負責接收HTTP斷點續傳控件上傳的文件塊數據,並更新數據庫中文件項進度信息。

db/FileResumer.cs

接收HTTP斷點續傳控件POST上來的文件塊數據,並將文件塊拼接成一個完整文件。

db/HttpUploaderCfg.cs

上傳文件夾配置類。可自定義文件上傳路徑。

db/HttpUploaderDB.cs

數據庫操作類。

db/xdb_files.cs

數據表模型。

db/XDebug.cs

輸出調試信息的簡單封裝。

js/combinbox.js

組合框JS類。封裝了文件列表和上傳列表兩個類。提供全局的配置信息。比如文件上傳地址,文件刪除地址,文件列表地址

js/FileLister.js

文件列表組件。

js/HttpUploader.js

文件上傳列表組件。

js/HttpUploader.css

控件樣式文件

js/jquery-1.3.2.min.js

JQuery壓縮文件。

index.htm

演示頁面。

test.htm

測試頁面

 

1.2.   創建數據庫

說明:

db文件夾中已自帶一個ACCESS數據庫文件:db.mdb。此數據庫文件可演示2G以下大小的文件斷點續傳功能。如果希望處理2G以上的文件,需要重建數據表。並將FileLength,FilePos,PostedLength字段類型改為long形。

xdb_files數據表設計如下:

字段名稱

類型

長度

描述

fid

自動編號

 

文件ID,唯一。

uid

int

 

用戶ID

FileNameLocal

varchar

255

文件在本地電腦中的名稱。例:QQ.exe

FileNameRemote

varchar

255

文件在服務器中的名稱。一般為文件MD5+擴展名。

FilePathLocal

varchar

512

文件在本地電腦中的完整路徑。

示例:D:\\Soft\\QQ.exe

FilePathRemote

varchar

512

文件在服務器中的完整路徑。

示例:F:\ftp\user1\QQ2012.exe

FilePathRelative

varhcar

512

文件在服務器中的相對路徑。

示例:/www/web/upload/QQ2012.exe

FileMD5

varchar

32

文件MD5

FileLength

varchar

19

文件總長度。以字節為單位

最大值:9,223,372,036,854,775,807

FileSize

varchar

10

格式化的文件尺寸。示例:10MB

FilePos

varchar

19

文件續傳位置。

最大值:9,223,372,036,854,775,807

PostedLength

varchar

19

已上傳長度。以字節為單位。

最大值:9,223,372,036,854,775,807

PostedPercent

varchar

6

已上傳百分比。示例:10%

PostComplete

是/否

1

是否已上傳完畢。

PostedTime

datetime

 

文件上傳時間

IsDeleted

是/否

1

是否已刪除。

 

1.3.   修改js/combinbox.js中的配置信息

找到如下語句:

     this.Config = {

         "EncodeType"           : "UTF-8"

         , "CompanyLicensed"    : "武漢命運科技有限公司"

         , "FileFilter"         : "*"//文件類型

         , "AllowMultiSelect"   : 1//多選開關。1:開啟多選。0:關閉多選

         , "AppPath"            : ""//網站虛擬目錄名稱。子文件夾 web

         , "CabPath"            : "http://www.ncmem.com/products/http-uploader4/demo/HttpUploader.cab#version=2,5,19,54681"

         , "UrlCreate"          : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_create_fid.aspx"

         , "UrlPost"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_post.aspx"

         , "UrlComplete"        : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_complete.aspx"

         , "UrlList"            : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_list.aspx"

         , "UrlDel"             : "http://localhost:1591/asp.net/demo-db-gb2312/db/ajax_del.aspx"

         , "ClsidPartition"      : "A6E74589-C2C6-48a2-B39E-B6C6A1A03AF0"

         , "ClsidDroper"        : "5A382701-5FCC-4aeb-B301-E365F7138FDB"

         , "ClsidUploader"       : "EC049103-5ABF-47fc-A8C9-7C48BB864449"

     };

將UrlCreate,UrlPost,UrlComplete,UrlList,UrlDel地址改為實際地址。

1.4.   與現有系統整合-將文件與用戶ID對應

主要步驟如下:

1.在引用頁面設置CombinBoxMgr.Fields的值

2.在HttpUploader.js的HttpUploader_MD5_Complete方法中增加Fields屬性

3.在ajax_create_fid.aspx頁面中接收附加信息

 

在combinbox.js文件中有一個字段Fields屬性,可通過擴展這個屬性的字段向服務器上傳特殊標識信息

     //附加參數

     this.Fields = {

         "UserName": "test"

         , "UserPass": "test"

         ,"uid":0//可以設置這個屬性的值

         ,"fid":0

     };

 

1.在引用頁面可以設置uid的值

<script language="javascript" type="text/javascript">

    var cbItemLast = null;

    var cbMgr = new CombinBoxMgr();

    cbMgr.Fields["uid"] = 2;//在這里可以設置為當前用戶ID的值

//也可以動態添加其它字段

cbMgr.Fields["Category"] = "soft";

 

     $(document).ready(function()

    {

         cbMgr.LoadInControl("FilePanel");

         cbMgr.Init();

    });

    </script>

 

2.在HttpUploader.js的HttpUploader_MD5_Complete方法中增加Fields屬性

//MD5計算完畢

function HttpUploader_MD5_Complete(obj)

{

     var md5 = obj.ATL.MD5;

     obj.MD5 = md5;

     //在此處增加服務器驗證代碼。

     obj.pMsg.innerText = "MD5計算完畢,開始連接服務器...";

 

     $.ajax({

         type: "POST"

         , url: obj.Config["UrlCreate"]

         , data: { md5: obj.MD5, uid: obj.Fields["uid"], fileLength: obj.FileLength, fileSize: obj.FileSize, pathLocal: obj.PathLocal, time: Date() }

         , success:

         function(msg)

         {

              var json = eval(msg)

              json = json[0];

              obj.fid = json.fid;

              obj.ResetFields();

              //服務器已存在相同文件,且已上傳完成

              if ("True" == json.PostComplete)

              {

                   obj.QuickComplete();

              } //服務器文件沒有上傳完成

              else

              {

                   obj.ATL.PostedLength = json.PostedLength;

                   obj.pProcess.style.width = json.PostedPercent;

                   obj.pPercent.innerText = json.PostedPercent;

                   obj.Upload();

              }

         }

        , error: function() { alert("向服務器發送MD5信息錯誤!"); }

 

     });

}

 

3.在ajax_create_fid.aspx中接收附加信息值

string uid = Request.Form["uid"];


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM