用於文件上傳的HTML表單 - 由JavaScript生成

Question

我一直在嘗試創建並提交一個帶有JavaScript的表單，用於將文件上傳到我的Web服務器。我讀過input type="file"由於安全原因無法通過JavaScript自動填充。既然如此，我怎樣才能發送一個POST命令來上傳我的文件？

我意識到下面的代碼片段不會工作，因爲這個事實，但我怎麼能做到這一點？

我最終希望做的是調用這個函數來獲取用戶拖放的大量文件，這樣他們就會在數組中。我的網絡服務器上沒有PHP（它只會提供簡單的HTTP命令）。

function uploadFile(fileName) 
    { 
    var form  = document.createElement("form"); 
    var element1 = document.createElement("file"); 

    form.method = "post"; 
    form.action = "upload.html"; 
    form.enctype = "multipart/form-data"; 
    form.charset = "utf-8"; 

    element1.value = "/Temp/TestFile.txt"; 
    element1.name = "upload1"; 
    form.appendChild(element1); 

    document.body.appendChild(form); 

    form.submit(); 
    } 

閱讀湯姆提供的第一個鏈接後，這是我想出了：

function uploadFile(fileName) 
    { 
    var form  = document.createElement("form"); 
    var element1 = document.createElement("file"); 

    form.method = "post"; 
    form.action = "upload.html"; 
    form.enctype = "multipart/form-data"; 
    form.charset = "utf-8"; 

    element1.value = "/JScript/TestText.txt" 
    element1.id = "fileselect"; 
    element1.name = "fileselect[]"; 
    element1.multiple = "multiple"; 
    form.appendChild(element1); 

    document.body.appendChild(form); 

    form.submit(); 
    } 

..但我不明白，使用fileselect []的..我會理解爲一個數組，但是如何填充一個數組然後將其分配回HTML元素？舉例來說，我只有一個文件可以發回，它是/JScript/TestText.txt。我如何分配fileselect [0] =「/ JScript/TestText.txt」;然後反饋給'元素'提交？

Answer 1

正確無法填充文件輸入的值。如果可以，您可以訪問用戶計算機上的任何文件，這將是一個巨大的安全問題。

另外，如果沒有服務器端腳本來驗證文件並將其存儲到正確的位置，您將無法將文件上傳到服務器。如果可以用apache來做到這一點，那麼您的網站訪問者可以將他們想要的任何內容上傳到您的服務器，包括病毒。

如果你確實設法讓服務器端的上傳工作（我會首先用一個標準的文件輸入字段來測試一個靜態的html表單），然後爲了讓你通過拖放操作接受一個文件並將它推送到服務器你需要html5文件api。大量的教程，如this one。

如果您想要一些能夠輕鬆跨平臺工作的健壯功能，請查看PlUpload這樣的內容，它至少可以實現客戶端的所有功能。