HTML5 및 아약스를 사용하여 파일 업로드 시도

Question

아약스를 사용하여 멋진 파일 업로드를 시도했으며 많은 항목에서 다음과 같이 프레임 워크를 완성했습니다. 내 HTML :

꽤 똑바로 앞으로

<form enctype="multipart/form-data" method="post"> 
<input name="file" type="file" /> 
<input type="button" value="Upload" /> 

.

내 PHP storeSales.php

if ($_FILES["file"]["name"] != NULL) { 
if (file_exists("accounting/" . $_FILES["file"]["name"])){ 
echo $_FILES["file"]["name"] . " already exists. "; 
}else{ 
move_uploaded_file($_FILES["file"]["tmp_name"], "accounting/" . $_FILES["file"]["name"]); 
} 
} 
$file = fopen($_FILES['myfile']['name'],'r') or die('cant open file'); 

내의 .js : 나는 파일을 업로드 할 때

$(":button").click(function(){ 
var formData = new FormData($('form')[0]); if (formData !=null) { 
alert("Got the file"); 
} else { 
alert("nothing Here"); 
} 

$.ajax({ 
    url: 'storeSales.php', //Server script to process data 
    type: 'POST', 
    xhr: function() { // Custom XMLHttpRequest 
     var myXhr = $.ajaxSettings.xhr(); 
     if(myXhr.upload){ // Check if upload property exists 
      myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload 
     } 
     return myXhr; 
    }, 
    //Ajax events 

    success: function(result) 
{ 
    console.log($.ajaxSettings.xhr().upload); 
    alert(result); 
}, 

    // Form data 
    data: formData, 
    //Options to tell jQuery not to process data or worry about content-type. 
    cache: false, 
    contentType: false, 
    processData: false 
}); 
}); 
function progressHandlingFunction(e){ 
if(e.lengthComputable){ 
    $('progress').attr({value:e.loaded,max:e.total}); 
} 
} 

, 나는 말한다 내의 .js 파일에 경고를 얻을 수 "있어 파일 "하지만 PHP 코드에서 파일을 비울 수 없다는 오류가 발생합니다. 내가 찾을 수 있었던 모든 것에서, 나는 PHP를 제대로하고 있다고 생각했다. 이것을 처리하는 올바른 방법은 무엇입니까? 나는 다른 것을 놓치고 있니?

Answer 1

파일을 업로드하는 데 아약스를 사용할 수 없습니다. 제 3 자 스크립트 없이는 잘못된 작업 (건방진 Ajax 경로를 통해)입니다. 즉, Ajax를 통해 $_FILES 데이터를 전달할 수 없습니다. $_POST 데이터 만 플러그인을 찾아야합니다.

Uploadify을 시도해보십시오 http://www.uploadify.com/