2016-05-07 48 views
2

我无法通过AJAX上传图片文件。无法从FormData获取服务器上的数据

网站:

<div> 
    <form id="birdi_image_form"> 
     <input type="file" name="birdi_image" id="birdi_image" ></input> 
    </form> 

    <input type="text" name="species"></input> 
    <textarea name="comments"></textarea> 
</div> 
<div id="debug"></div> 

<script type="text/javascript"> 

jQuery(function($){ 
    $('#birdi_image').change(function(){ 
     var ima = new FormData($('#birdi_image_form')[0]); 

     $.ajax({ 
      url:"/bird/bird_scripts/fu.php", 
      type:"post", 
      data: ima, 
      processData: false, 
      dataType:"text", 
      success:function(data, textStatus, jqXHR) { 
       $('#debug').text(data); 
      } 
     }); 
    }); 
}); 

</script> 

/bird/bird_scripts/fu.php:

<?php 

$imagedir = '/images'; 
$tmpfname = tempnam($imagedir, "b_"); 

echo var_dump($_POST); 

if (move_uploaded_file($_FILES['birdi_image']['tmp_name'], $tmpfname)) { 
    echo "File is valid, and was successfully uploaded.\n"; 
} else { 
    echo "Upload failed"; 
} 

?> 

环视在线我期待找到我$_FILES变量内容,但这是空的。将$_POST var抛出到屏幕上,如下例所示。 $_POST['birdi_image']给我NULL

阵列(68){[ “------ WebKitFormBoundaryYCAoI8shwgBavjJP 内容处置:_form数据; _name”] =>的字符串(339) “” birdi_image “; 文件名=” test.jpg放在“Content-Type:image/jpeg JFIFdd ExifMM bj(1r2 i [email protected]'B @'Adobe Photoshop CS2 Windows2008:06:24 11:11:48 b g“ [”?o ( ci \ R Μꟑ ]T z “] => string(82)” f zߠ 012i ���/��v��E~��[,�Y �s�������1l�G����-���߿�enu'=�v�z���=?Ҳ���" ["�{��<o��ӗ�M��ysnʨo87~;l���۔�"]=> string(172) "�<��t�2~���O�S �����t���㵺C�}E������}��I�d]c���y}#�����C,�Z��־��V��ynʿ��?�g�*����o��ٌ�.}�y����}��z����w^�]�m�u������z>�37�_C긵��K�Y-{��뺷��M���ul��Y�" ["c�yhHp����"]=> string(152) "��[-���1�]��|�����۽Q�\�e���o�~��g������u�.���A��t�]�3�W�ד��b���}>�����%��K���Ѳ�3���zX��qZ��}u��sc� ���N� ^-w�7���\r� ����c��=?՗δX�j" ["C�uw���-��"]=> string(57) "���m��w��������ѩ���������k��r����m�t�62rIk���m�ߗV��}" ["�"]=> string(384) "!�<��B���6*�c��劷Q���uF*��U��������ď,� y {R E% Q 5. IE N Ο ̿4〜R .. .............上传失败。

我已经使用完整的表单提交之前上传了文件。这是我第一次尝试使用AJAX做到这一点。它看起来像数据到达服务器,但我似乎无法从服务器端理解它。正如你在代码中看到的那样,我期望$_FILES['birdi_image']存在,但它不存在。我在做一些完全错误的事情吗?

感谢

回答

3

你必须设置内容类型为false,否则jQuery将设置一个(错误的)你

$.ajax({ 
     url:"/bird/bird_scripts/fu.php", 
     type:"post", 
     data: ima, 
     processData: false, 
     contentType: false, 
     dataType:"text", 
     success:function(data, textStatus, jqXHR) { 
      $('#debug').text(data); 
     } 
    }); 
+0

就是这样,谢谢。 –

1

我这个也挣扎 - 它只是不一样简单它应该是。我终于找到了一个正确的人,并研究了他的代码。

Ravi Kusuma's jQuery File Upload

最后,因为库苏马写了一个插件,我只是用他的代码/插件。为什么重新发明轮子?他已经解决了所有问题,直到发送额外的数据以及上传的文件。