PHP和AJAX文件上传:$ _FILES数组为空

时间:2014-12-07 00:18:37

标签: php ajax file-upload

我正在尝试构建一个允许在PHP中上传文件的应用程序。上传文件时,应将下载链接附加到特定div。我正在使用ajax调用来运行php脚本,以便我可以让文件下载链接回显而不会卡在php页面上。 (我希望这是有道理的。)

这是html:

<form action="php/upload.php" method="POST" enctype="multipart/form-data" id="uploadform">
                Select file to upload:
                <input type="file" name="fileToUpload" id="file">
                <input id="create" type="submit" value="Upload File">
</form>

以下是进行ajax调用的外部javascript / jquery:

$(function () {
  $('form').on('submit', function (e) {
          //prevents reloading of page
          e.preventDefault();
          //get file data
          var file_data = $("#file").prop("files")[0];
          var form_data = new FormData();
          form_data.append('file', file_data);
          //run upload.php script and append result to draggable block
          $.ajax({
            type: 'post',
            url: 'php/upload.php',
            cache: false,
            data: form_data,
            success: function (data) {
              $( "#draggable"+i).append(data);
              i++;
            }
          });

        });
});

以下是应该上传文件的外部php脚本:

<?php

    $target_path = "../uploads/";
    $target_path = $target_path . basename( $_FILES[ 'fileToUpload' ][ 'name' ] );

    if ( move_uploaded_file( $_FILES[ 'fileToUpload' ][ 'tmp_name' ] , $target_path ) ){
        //echo '<a href=' . $target_path . ' download>Download</a>';
    } 
    else {
        echo $target_path;
        //var_dump($_FILES);
    }

我收到以下错误:未捕获的TypeError:非法调用

问题来自于尝试在ajax调用中传递'form_data'。我试图这样做,因为一旦php脚本运行,$ _FILES数组就会变空。我需要一种方法来确保我上传的文件存储在该数组中。

1 个答案:

答案 0 :(得分:3)

我自己解决了。需要在ajax调用中添加几个东西:

$.ajax({
            type: 'post',
            url: 'php/upload.php',
            cache: false,
           ** contentType: false, **
           ** processData: false, **
            data: new FormData(this),
            success: function (data) {
              $( "#draggable"+i).append(data);
              i++;