XMLHttpRequest不發送文件

我想通過XMLHttpRequest上傳文件。我到處尋找例子，並發現不少。但我無法弄清楚我做錯了什麼。這是我的代碼。按下按鈕時觸發該功能。它沒有包裹在標籤中XMLHttpRequest不發送文件

function upl_kost() { 
var url = "proces_data.php?ref=upload_kost"; 
var hr; 
var file = document.getElementById("file_kost"); 
var formData = new FormData(); 

formData.append("upload", file.files[0]); 

if (window.XMLHttpRequest) { 
    hr=new XMLHttpRequest(); 
    } else { 
    hr=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
hr.open("POST", url, true); 

hr.setRequestHeader("Content-type", "multipart/form-data"); 

hr.onreadystatechange = function() { 
    if(hr.readyState == 4 && hr.status == 200) { 
     var return_data = hr.responseText; 
     alert(return_data); 
    } 
} 
hr.send(formData); 
}

並且該功能捕捉到它。

if($_GET['ref'] == 'upload_kost') { 
var_dump($_FILES); 
}

我的問題是$ _FILES保持空白。當我查看js中的file.files變量時，它將加載來自我想要上傳的文件中的數據。

謝謝！

來源

2014-08-30 Jaap115

文件（上傳）需要POST方法，而不是GET。所以，如果您的表單的方法設置爲GET，請將其更改爲POST。你也可以使用'$ _REQUEST'來代替'$ _GET'，它可以用於POST和GET。嘗試'if（$ _ REQUEST ['ref'] =='upload_kost'）' – 2014-08-30 16:40:36

@ Fred-ii-'ref = upload_kost'在'url'中，即它是一個_GET_參數。 _XMLHttpRequest_作爲_POST_打開，然後'formData'作爲發佈數據發送。 – 2014-08-30 16:42:54

我認爲那不是問題。正如你所看到的hr.open（「POST」，url，true）;它被設置爲發佈。 vardump被觸發，但它只是空的 – Jaap115 2014-08-30 16:43:12

減少你的JavaScript下調至所需的最小，然後添加一些有用的信息，你可以看看你的控制檯

function upl_kost() { 
    var xhr = new XMLHttpRequest(), 
     url = 'proces_data.php?ref=upload_kost', 
     fd = new FormData(), 
     elm = document.getElementById('file_kost'); 

    // debug <input> 
    if (!elm) 
     console.warn('Element not found'); 
    else if (!(elm instanceof HTMLInputElement)) 
     console.warn('Element not an <input>'); 
    else if (!elm.files || elm.files.length === 0) 
     console.warn('<input> has no files'); 
    else 
     console.info('<input> looks okay'); 
    // end debug <input> 

    fd.append('upload', elm.files[0]); 

    xhr.addEventListener('load', function() { 
     console.log('Response:', this.responseText); 
    }); 

    xhr.open('POST', url); 
    xhr.send(fd); 
}

如果你仍然有問題，也可能是服務器 - 方面，例如您在嘗試訪問$_FILES之前是否正在執行重定向？

來源

2014-08-30 16:58:27

奧克我試過了，它說輸入看起來不錯。我沒有執行任何重定向。 proces_data.php是一個頁面，我抓住了我所有的xmlhttprequests。我的文章中的代碼是存在的。 – Jaap115 2014-08-30 17:02:05

您可以做的最後一個客戶端檢查是查看xmlhttprequest的網絡選項卡/啓用控制檯日誌記錄，並從控制檯中查看發送的數據確實是否包含該文件（我99％肯定會這樣做），然後你肯定知道問題在服務器端。試着做一個'var_dump'，它不在任何'if's/functions/etc中，例如使用僅包含'var_dump'的新_php_頁進行測試。 – 2014-08-30 17:07:25

當我使用這段代碼，我看着xhr.responseText;其作品。我沒有idee爲什麼它的工作與此代碼，而不是我的，但它確實 – Jaap115 2014-08-30 17:07:29

您的問題是你設置請求的內容類型

hr.setRequestHeader("Content-type", "multipart/form-data");

如果你見過一個多/ FORMDATA後你會發現內容類型頭有一個邊界

Content-Type: multipart/form-data; boundary=----webko2354645675756

這是你的代碼中缺少的。
如果您未設置內容類型標題，瀏覽器將正確設置它和所需的邊界。這將允許服務器正確解析請求主體。

來源

2014-08-31 02:35:09 Musa

XMLHttpRequest不發送文件

回答

相關問題