多個文件上傳
① 多文件上傳思路
大概看了一下的代碼，這個程序應該是 Web Form 的程序吧？
如果是這樣的話，你可以 javascript 的方式來實現啊。比如開始頁面上只有一個 <input type="file" name="uploader" />。旁邊加一個按鈕或者鏈接什麼的，當被點擊的時候調用客戶端腳本添加一個新的 <input type="file" name="uploader" /> 元素。這樣就可以同時上傳多個文件了哦
然後在伺服器端可以調用 Page.Request.Files 獲取剛上傳的文件
==================================
在 .NET 中，FileUpload 控制項最後都會被轉化成HTML中的 <input type="text" /> 元素。而這個 HTML 元素是只能一次上傳一個文件的。
你如果要一次上傳幾個文件：
1. 用腳本生成多個 <input type="text" /> HTML 元素
2. 如果只使用一個 FileUpload 控制項，那麼點上傳的時候可以將文件暫時保存在伺服器的內存中。這樣 FileUpload 就又可以繼續上傳新的文件了
② 怎樣利用ajax實現多個文件上傳
<script type="text/javascript">
$(document).ready(function () {
$("#uploadify").uploadify({
'uploader': 'image/uploadify.swf', //uploadify.swf文件的相對路徑，該swf文件是一個帶有文字BROWSE的按鈕，點擊後淡出打開文件對話框
'script': 'Handler1.ashx',// script ： 後台處理程序的相對路徑
'cancelImg': 'image/cancel.png',
'buttenText': '請選擇文件',//瀏覽按鈕的文本，默認值：BROWSE。
'sizeLimit':999999999,//文件大小顯示
'floder': 'Uploader',//上傳文件存放的目錄
'queueID': 'fileQueue',//文件隊列的ID，該ID與存放文件隊列的div的ID一致
'queueSizeLimit': 120,//上傳文件個數限制
'progressData': 'speed',//上傳速度顯示
'auto': false,//是否自動上傳
'multi': true,//是否多文件上傳
//'onSelect': function (e, queueId, fileObj) {
// alert("唯一標識:" + queueId + "\r\n" +
// "文件名：" + fileObj.name + "\r\n" +
③ 怎樣實現多文件同時上傳.只要思路不要代碼
方法很多
1. 不是太可靠的方法，時間值加上一個隨機數。
2. 相對1好一點的方法。用 md5 或者 crc 等演算法對文件產生一個校驗碼，這個結合時間，一般不會重復。
3. 最穩妥的解決辦法。如果你願意操作資料庫的話，建立一個有自增主鍵的表，每個文件插入一條記錄，用獲得的自增主鍵（last_insert_id）命名文件就可以。如果你覺得記錄下來太占空間，隨後刪除記錄都可以，自增主鍵還是會保留和繼續累加的。
④ 利用多個input上傳多個文件，伺服器怎麼處理
伺服器fork多個子進程，分別處理客戶請求
⑤ java實現多文件上傳
即使再多文件也是通過的單個文件逐次上傳的（zip等壓縮包實際上是一個文件）。實現思路就是將多個文件循環進行上傳，上傳方法舉例：
/**
* 上傳文件
*
* @param fileName
* @param plainFilePath 文件路徑路徑
* @param filepath
* @return
* @throws Exception
*/
public static String fileUploadByftp(String plainFilePath, String fileName, String filepath) throws Exception {
FileInputStream fis = null;
ByteArrayOutputStream bos = null;
FTPClient ftpClient = new FTPClient();
String bl = "false";
try {
fis = new FileInputStream(plainFilePath);
bos = new ByteArrayOutputStream(fis.available());
byte[] buffer = new byte[1024];
int count = 0;
while ((count = fis.read(buffer)) != -1) {
bos.write(buffer, 0, count);
}
bos.flush();
Log.info("加密上傳文件開始");
Log.info("連接遠程上傳伺服器"+CCFCCBUtil.CCFCCBHOSTNAME+":"+22);
ftpClient.connect(CCFCCBUtil.CCFCCBHOSTNAME, 22);
ftpClient.login(CCFCCBUtil.CCFCCBLOGINNAME, CCFCCBUtil.CCFCCBLOGINPASSWORD);
FTPFile[] fs;
fs = ftpClient.listFiles();
for (FTPFile ff : fs) {
if (ff.getName().equals(filepath)) {
bl="true";
ftpClient.changeWorkingDirectory("/"+filepath+"");
}
}
Log.info("檢查文件路徑是否存在：/"+filepath);
if("false".equals(bl)){
ViewUtil.dataSEErrorPerformedCommon( "查詢文件路徑不存在："+"/"+filepath);
return bl;
}
ftpClient.setBufferSize(1024);
ftpClient.setControlEncoding("GBK");
// 設置文件類型（二進制）
ftpClient.setFileType(FTPClient.BINARY_FILE_TYPE);
ftpClient.storeFile(fileName, fis);
Log.info("上傳文件成功："+fileName+"。文件保存路徑："+"/"+filepath+"/");
return bl;
} catch (Exception e) {
throw e;
} finally {
if (fis != null) {
try {
fis.close();
} catch (Exception e) {
Log.info(e.getLocalizedMessage(), e);
}
}
if (bos != null) {
try {
bos.close();
} catch (Exception e) {
Log.info(e.getLocalizedMessage(), e);
}
}
}
}
備註：只需要修改上傳的伺服器地址、用戶名、密碼即可進行伺服器訪問上傳。根據實際需要修改即可。
⑥ file控制項怎麼上傳多個文件
File控制項是一個必須結合伺服器端功能才能實現的純客戶端控制項。
要使得文件上載能夠成功，要做到以下幾點:
INPUT type=file 元素必須出現在 FORM 元素內。
必須為 INPUT type=file 元素指定 NAME 標簽屬性的值。
FORM 元素 METHOD 標簽屬性的值必須設置為 post。
FORM 元素 ENCTYPE 標簽屬性的值必須設置為 multipart/form-data。
要處理上載到伺服器的文件，伺服器端進程必須可以處理 multipart/form-data 的提交。例如，Microsoft Posting Acceptor 能夠允許 Microsoft Internet Information Server (IIS) 接受文件上載。而在網上也可找到其它的 Common Gateway Interface (CGI) 腳本用於處理 multipart/form-data 提交。
用戶選擇要上載的文件並提交頁面後，該文件作為請求的一部分上載。文件將被完整地緩存在伺服器內存中。
File控制項一次只能上傳一個文件，並且其文件屬性值都是只讀的。採用File控制項同時上傳多個文件，實際上是動態生成多個File控制項，每選擇上傳一個文件，隱藏該控制項，生成另一個File控制項。這里只需要簡單的JavaScript技巧既可以實現，所以不做贅述。
以ASP.NET為例，介紹在伺服器端所需要進行的處理。
//獲取上傳文件列表
HttpFileCollection fileCollection = HttpContext.Current.Request.Files;
//逐個上傳每個文件
for (int index = 0; index < HttpContext.Current.Request.Files.Count; index++)
{
HttpPostedFile postedFile = HttpContext.Current.Request.Files[index];
filename = postedFile.FileName;
if (postedFile.FileName != "")
{
postedFile.SaveAs(uploadPath);
}
}
⑦ 如何上傳多個文件
含義 ENCTYPE="multipart/form-data" 說明：
通過 http 協議上傳文件 rfc1867協議概述，jsp 應用舉例，客戶端發送內容構造
1、概述在最初的 http 協議中，沒有上傳文件方面的功能。 rfc1867 (http://www.ietf.org/rfc/rfc1867.txt) 為 http 協議添加了這個功能。客戶端的瀏覽器，如 Microsoft IE, Mozila, Opera 等，按照此規范將用戶指定的文件發送到伺服器。伺服器端的網頁程序，如 php, asp, jsp 等，可以按照此規范，解析出用戶發送來的文件。Microsoft IE, Mozila, Opera 已經支持此協議，在網頁中使用一個特殊的 form 就可以發送文件。絕大部分 http server ，包括 tomcat ，已經支持此協議，可接受發送來的文件。各種網頁程序，如 php, asp, jsp 中，對於上傳文件已經做了很好的封裝。
2、上傳文件的實例：用 servelet 實現（http server 為 tomcat 4.1.24）1. 在一個 html 網頁中，寫一個如下的form ：
load multi files :
text field :
用戶可以選擇多個文件，填寫表單其它項，點擊「提交」按鈕後就開始上傳給 http://192.168.29.65/upload_file/UploadFile
這是一個 servelet 程序注意 enctype="multipart/form-data", method=post, type="file" 。根據 rfc1867, 這三個屬性是必須的。multipart/form-data 是新增的編碼類型，以提高二進制文件的傳輸效率。具體的解釋請參閱 rfc18672. 服務端 servelet 的編寫現在第三方的 http upload file 工具庫很多。Jarkata 項目本身就提供了fileupload 包http://jakarta.apache.org/commons/fileupload/ 。
文件上傳、表單項處理、效率問題基本上都考慮到了。在 Struts 中就使用了這個包，不過是用 Struts 的方式另行封裝了一次。這里我們直接使用 fileupload 包。至於Struts 中的用法，請參閱 Struts 相關文檔。這個處理文件上傳的 servelet 主要代碼如下：
public void doPost( HttpServletRequest request, HttpServletResponse response )
{
DiskFileUpload diskFileUpload = new DiskFileUpload(); // 允許文件最大長度
diskFileUpload.setSizeMax( 100*1024*1024 ); // 設置內存緩沖大小
diskFileUpload.setSizeThreshold( 4096 ); // 設置臨時目錄
diskFileUpload.setRepositoryPath( "c:/tmp" );
List fileItems = diskFileUpload.parseRequest( request );
Iterator iter = fileItems.iterator(); for( ; iter.hasNext(); )
{
FileItem fileItem = (FileItem) iter.next();
if( fileItem.isFormField() ) { // 當前是一個表單項
out.println( "form field : " + fileItem.getFieldName() + ", " + fileItem.getString() );
} else {
// 當前是一個上傳的文件
String fileName = fileItem.getName();
fileItem.write( new File("c:/uploads/"+fileName) );
}
}}
為簡略起見，異常處理，文件重命名等細節沒有寫出。3、 客戶端發送內容構造假設接受文件的網頁程序位於 http://192.168.29.65/upload_file/UploadFile.假設我們要發送一個二進制文件、一個文本框表單項、一個密碼框表單項。文件名為 E:\s ，其內容如下：（其中的XXX代表二進制數據，如 01 02 03）abbXXXccc 客戶端應該向 192.168.29.65 發送如下內容：
POST /upload_file/UploadFile HTTP/1.1
Accept: text/plain, */*
Accept-Language: zh-cn
Host: 192.168.29.65:80
Content-Type:multipart/form-data;boundary=---------------------------7d33a816d302b6
User-Agent: Mozilla/4.0 (compatible; OpenOffice.org)
Content-Length: 424
Connection: Keep-Alive -----------------------------7d33a816d302b6
Content-Disposition:form-data;
name="userfile1";
filename="E:\s"Content-Type:
application/octet-stream abbXXXccc
-----------------------------7d33a816d302b6
Content-Disposition: form-data;
name="text1" foo
-----------------------------7d33a816d302b6
Content-Disposition: form-data;
name="password1" bar
-----------------------------7d33a816d302b6--
(上面有一個回車)此內容必須一字不差，包括最後的回車。
注意：Content-Length: 424 這里的424是紅色內容的總長度（包括最後的回車）
注意這一行：Content-Type: multipart/form-data; boundary=---------------------------7d33a816d302b6
根據 rfc1867, multipart/form-data是必須的.---------------------------7d33a816d302b6 是分隔符，分隔多個文件、表單項。
其中33a816d302b6 是即時生成的一個數字，用以確保整個分隔符不會在文件或表單項的內容中出現。前面的 ---------------------------7d 是 IE 特有的標志。
Mozila 為---------------------------71用手工發送這個例子，在上述的 servlet 中檢驗通過。
使用POST發送數據
以POST方式發送數據主要是為了向伺服器發送較大量的客戶端的數據，它不受URL的長度限制。POST請求將數據以URL編碼的形式放在HTTP正文中，欄位形式為fieldname=value，用&分隔每個欄位。注意所有的欄位都被作為字元串處理。實際上我們要做的就是模擬瀏覽器POST一個表單。以下是IE發送一個登陸表單的POST請求：
POST http://127.0.0.1/login.do HTTP/1.0
Accept: image/gif, image/jpeg, image/pjpeg, */*
Accept-Language: en-us,zh-cn;q=0.5
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)
Content-Length: 28
\r\n
username=admin&password=1234
要在MIDP應用程序中模擬瀏覽器發送這個POST請求，首先設置HttpConnection的請求方式為POST：
hc.setRequestMethod(HttpConnection.POST);
然後構造出HTTP正文：
byte[] data = "username=admin&password=1234".getBytes();
並計算正文長度，填入Content-Type和Content-Length：
hc.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
hc.setRequestProperty("Content-Length", String.valueOf(data.length));
然後打開OutputStream將正文寫入：
OutputStream output = hc.openOutputStream();
output.write(data);
需要注意的是，數據仍需要以URL編碼格式編碼，由於MIDP庫中沒有J2SE中與之對應的URLEncoder類，因此，需要自己動手編寫這個encode()方法，可以參考java.net.URLEncoder.java的源碼。剩下的便是讀取伺服器響應，代碼與GET一致，這里就不再詳述。
使用multipart/form-data發送文件
如果要在MIDP客戶端向伺服器上傳文件，我們就必須模擬一個POST multipart/form-data類型的請求，Content-Type必須是multipart/form-data。
以multipart/form-data編碼的POST請求格式與application/x-www-form-urlencoded完全不同，multipart/form-data需要首先在HTTP請求頭設置一個分隔符，例如ABCD：
hc.setRequestProperty("Content-Type", "multipart/form-data; boundary=ABCD");
然後，將每個欄位用「--分隔符」分隔，最後一個「--分隔符--」表示結束。例如，要上傳一個title欄位"Today"和一個文件C:\1.txt，HTTP正文如下：
--ABCD
Content-Disposition: form-data; name="title"
\r\n
Today
--ABCD
Content-Disposition: form-data; name="1.txt"; filename="C:\1.txt"
Content-Type: text/plain
\r\n
--ABCD--
\r\n
請注意，每一行都必須以\r\n結束，包括最後一行。如果用Sniffer程序檢測IE發送的POST請求，可以發現IE的分隔符類似於---------------------------7d4a6d158c9，這是IE產生的一個隨機數，目的是防止上傳文件中出現分隔符導致伺服器無法正確識別文件起始位置。我們可以寫一個固定的分隔符，只要足夠復雜即可。
發送文件的POST代碼如下：
String[] props = ... // 欄位名
String[] values = ... // 欄位值
byte[] file = ... // 文件內容
String BOUNDARY = "---------------------------7d4a6d158c9"; // 分隔符
StringBuffer sb = new StringBuffer();
// 發送每個欄位:
for(int i=0; i
sb = sb.append("--");
sb = sb.append(BOUNDARY);
sb = sb.append("\r\n");
sb = sb.append("Content-Disposition: form-data; name=\""+ props[i] + "\"\r\n\r\n");
sb = sb.append(URLEncoder.encode(values[i]));
sb = sb.append("\r\n");
}
// 發送文件:
sb = sb.append("--");
sb = sb.append(BOUNDARY);
sb = sb.append("\r\n");
sb = sb.append("Content-Disposition: form-data; name=\"1\"; filename=\"1.txt\"\r\n");
sb = sb.append("Content-Type: application/octet-stream\r\n\r\n");
byte[] data = sb.toString().getBytes();
byte[] end_data = ("\r\n--" + BOUNDARY + "--\r\n").getBytes();
// 設置HTTP頭:
hc.setRequestProperty("Content-Type", MULTIPART_FORM_DATA + "; boundary=" + BOUNDARY);
hc.setRequestProperty("Content-Length", String.valueOf(data.length + file.length + end_data.length));
// 輸出:
output = hc.openOutputStream();
output.write(data);
output.write(file);
output.write(end_data);
// 讀取伺服器響應：
// TODO...
⑧ 如何通過js完成多個文件的上傳
HTML5 file組件的新屬性
accept : 如果在file組件中增加這個屬性就可以直接控制上傳的文件類型了，實在是很方便。
multiple：是否允許選擇多個文件
HTML5 頁面代碼修改後
<img width="400" height="250"/><br />
<input type="file" id="pic" name="pic" onchange="printFileInfo()" accept="image/*" multiple="multiple"/>
<input type="button" value="上傳圖片" onclick="uploadFile()" /><br />
<div id="parent">
<div id="son"></div>
</div>
accept 的值可以參閱：IANA MIME 類型（標准 MIME 類型的完整列表），如果使用的是DW開發的話，軟體本身就有提示。
如果選擇了多個文件，可以用JS做循環列印，看看文件的名稱，類型和大小,看演示代碼
function printFileInfo(){
var picFile = document.getElementById("pic");
var files = picFile.files;
for(var i=0; i<files.length; i++){
var file = files[i];
var div = document.createElement("div")
div.innerHTML = "第("+ (i+1) +") 個文件的名字："+ file.name +
" , 文件類型："+ file.type +" , 文件大小:"+ file.size
document.body.appendChild( div)
}
}
既然可以循環多文件的話，就可以嘗試多文件上傳了。
1、首先創建 XMLHttpRequest 對象
//這是全局變數。因為是示例，所以就沒有判斷瀏覽器類型，低版本IE這么寫的話會出問題的
var xhr = new XMLHttpRequest()
2、上篇介紹了進度事件(Progress) ， 這次實現 progress 和 error 2個事件
error：在請求發生錯誤時觸發。
對應上傳時發生錯誤導致的上傳失敗：uploadFailed()
//上傳失敗
function uploadFailed(evt) {
alert("上傳失敗");
}
progress：在接收相應期間持續不斷觸發。
對應上傳進度方法：onprogress()
/**
* 偵查附件上傳情況 ,這個方法大概0.05-0.1秒執行一次
*/
function onprogress(evt){
var loaded = evt.loaded; //已經上傳大小情況
var tot = evt.total; //附件總大小
var per = Math.floor(100*loaded/tot); //已經上傳的百分比
$("#son").html( per +"%" );
$("#son").css("width" , per +"%");
}
最後就是上傳方法了，注意上面的html代碼中上傳用的方法也需要改成這個uploadFile()方法才能正常使用。
//上傳文件
function uploadFile() {
//將上傳的多個文件放入formData中
var picFileList = $("#pic").get(0).files;
var formData = new FormData();
for(var i=0; i< picFileList.length; i++){
formData.append("file" , picFileList[i] );
}
//監聽事件
xhr.upload.addEventListener("progress", onprogress, false);
xhr.addEventListener("error", uploadFailed, false);//發送文件和表單自定義參數
xhr.open("POST", "upload");
//記得加入上傳數據formData
xhr.send(formData);
}
⑨ 怎麼在form里分別上傳多個文件，如圖
可以用iframe上傳，orm表單的method、 enctype屬性必須和下面代碼一樣。然後將target的值設為iframe的name，這樣就可以實現無刷新上傳文件。
<form action="uploadfile.php" enctype="multipart/form-data" method="post" target="iframeUpload">
<iframe name="iframeUpload" src="" width="350" height="35" frameborder=0 SCROLLING="no" style="display:NONE"></iframe>
<input id="test_file" name="test_file" type="file">
<input value="上傳文件" type="submit">
</form>
⑩ html有關多個文件上傳
//改好了沒問題..加文件試試
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
function imgChange(next) {
if(next != null)
document.getElementById(next).style.display = "";
}
function validate() {
var phos = 2;
for(i = 0; i < 2; i++) {
if($("del" + i).checked == true)
phos--;
}
for(i = 0; i < 4; i++) {
if($("photoFile" + i).value != "")
phos++;
}
if(phos > 4) {
alert("圖片太多,您最多總共可以保存4張圖片!");
return false;
}
return true;
}
</script>
<form action="/addTrade.do" method="post" enctype="multipart/form-data" onSubmit="return validate()">
<!-- 上傳照片-->
<div>
<table width="100%" border="0" cellspacing="0" cellpadding="0"
summary="upload pictures">
<tr id="tr_photoFile0">
<td width="119" align="right" class="title">
上傳照片：
</td>
<td width="499">
<input type="file" name="photoFile0" id="photoFile0"
size="40" onChange='return imgChange("tr_photoFile1")' />
</td>
</tr>
<tr id="tr_photoFile1" style="display: none;">
<td>
</td>
<td>
<input type="file" name="photoFile1" id="photoFile1"
onChange='return imgChange("tr_photoFile2")' size="40" />
</td>
</tr>
<tr id="tr_photoFile2" style="display: none;">
<td>
</td>
<td>
<input type="file" name="photoFile2" id="photoFile2"
onChange='return imgChange("tr_photoFile3")' size="40" />
</td>
</tr>
<tr id="tr_photoFile3" style="display: none;">
<td>
</td>
<td>
<input type="file" name="photoFile3" id="photoFile3"
onChange='return imgChange(null)' size="40" />
</td>
</tr>
</table>
</div>
<!--/ 上傳照片-->
<input name="submit" type="submit" value="提交"/>
</form>