处理PHP上传文件与AJAX请求/响应的错误代码NO JQuery

时间:2015-07-25 15:25:36

标签: php ajax file upload

我想在不选择文件的情况下提交表单,通常我会得到php错误代码4 =>没有从$_FILES['file']['error']上传文件如果我只使用HTML和PHP,那么一切正常,但是当我添加AJAX时却没有!

我的问题:

  • 我不知道如何发布/发送空文件数组以便能够处理 它在PHP脚本中!
  • 我不知道如何将回复写回AJAX脚本,如果它正在进行中处理程序,或错误处理程序或我不知道......!
  • 我不想使用JQuery,我复制/粘贴所有代码以构建任何东西,因为我在编码的0级,所以我需要理解每一行,JQuery在我看来像星际空间!

表格:

<form id="upload_form" enctype="multipart/form-data" method="post" >

    <input type="file" name="file" id="file_id" /><br />
    <input type="button" value="Upload File" onclick="uploadFile()" /><br />

</form> 

JS脚本:

<script>
function uploadFile(){

    // target the file that is to be uploaded
    var file = document.getElementById("file_id").files[0];
    // var file = document.getElementById("file_id"); is not working,
    // what is files ? why do i need .files[0]?

    // Create a new formdata object instance
    var formdata = new FormData();

    // append the file to the formdata
    formdata.append("file", file); 
    // on submit, if no file selected, the error index is 4 in php
    // do i have to append the file error here ?

    // Build the AJAX request
    var xhr = new XMLHttpRequest(); 

    // add event listeners

    // progress handler 
    xhr.upload.addEventListener("progress", progress_handler, false);

    // complete handler        
    xhr.addEventListener("load", complete_handler, false);

    // error handler
    xhr.addEventListener("error", error_handler, false);

    // abort handler
    xhr.addEventListener("abort", abort_handler, false);


    // open a php script
    xhr.open("POST", "file_upload.php");

    // send the AJAX request
    xhr.send(formdata);
}

function progress_handler(event){  
    // create a progress bar, or a % of uploading...
    // using event.loaded and event.total (returns size in bytes)
}

// when the operation is finished
function complete_handler(event){

    // the message php is echoing will be put inside that div
    // using responseText !
    document.getElementById("some_div").innerHTML = event.target.responseText;
    // can we echo back other things beside strings, like an array, int... ?

    //set the progress bar to full
}

function error_handler(event){
    document.getElementById("status").innerHTML = "Upload failed !";
    // do i need to append the error here instead ? how ?
    // nothing that i tried around $_FILES[file]['error'] in php worked back here !
}

function abort_handler(event){
    //cancel listener if the file upload is aborted
    document.getElementById("status").innerHTML = "Upload aborted !";

}
</script>

php文件:file_upload.php

<?php

echo '<pre>';  print_r($_FILES);  echo '</pre>';
// this is working when file is selected and echo back all array elements
// but why there NOTHING returned when no file selected, not even en empty array !!!
// -----------------------------------------------------

if(isset($_FILES['file']) AND $_FILES['file']['error'] == 0) 
{
    // move the file from the tmp folder to upload folder in website
}
else
{
    echo "Error : Please select a file before clicking the Upload button !";
    // i don't want this which is working!

    echo $_FILES["file"]["error"]; 
    // i want this which is working only without AJAX !!!
    // and would be : 
    // 1 > The uploaded file exceeds the upload_max_filesize directive in php.ini
    // ...
    // 4 > No file was uploaded at all !
    // until 
    // 8 > a php extension stopped the upload...
}
?>

非常感谢你。

1 个答案:

答案 0 :(得分:0)

您应该阻止内容类型自动检测。 我这样做(使用jQuery)

 $.ajax({
            url: "<YOUR URL HERE>",
            data: formData, //filled formData instance
            type: "POST",
            dataType: 'json',
            contentType: false,
            cache: false,
            processData: false
        })

它适用于我。