【问题标题】：File not received at server using FormData使用 FormData 在服务器上未收到文件
【发布时间】：2017-05-21 04:05:05
【问题描述】：

我正在将一个包含文件的表单上传到我的服务器，该服务器运行验证并返回成功或失败。

使用 Ajax 和 FormData 发送表单。

在我的测试服务器上接收到所有数据，包括文件。但是，在我的实时服务器上，它返回说此文件丢失。

如果我在文件存在的两个环境中询问 FormData 对象，它似乎永远不会到达服务器。

显然我已经删除了一些项目并替换为 *s 并且帖子网址是由页面生成的。

HTML：

<form method="POST" action="https://******" accept-charset="UTF-8" enctype="multipart/form-data">
<div class="row">
    <div class="col-md-6">
       <div class="form-group" id="sport_types">
           <label for="match">What match is this video from</label>
           <select id="event_select" name="match" class="form-control">
               <option value="">Select Match</option>
               <option value="9024802136436009">Rugby Newers</option>
            </select>
        </div>
        <div class="form-group">
           <label for="video">Choose your video</label><br>
           <div class="fileUpload btn btn-info">
              <span id="upload_text">Choose Video</span>
              <input id="imageLoader" accept="video/*" type="file" name="video">
            </div>
             <div id="fileName"></div>
        </div>
        <div class="form-group">
           <label for="video_name">Enter a short description of the video</label>
           <input name="video_name" type="text" class="form-control" placeholder="Video Description" value="">
        </div>
        <input type="hidden" name="video_id" value="0">
    </div>
</div>

<div id="form_buttons_image">
    <a class="btn btn-default" href="/video/1451290748440885">Cancel</a>
        <input id="submit" type="submit" class="btn btn-info  hidden ">
        <span id="uploading_feedback" class="hidden">Uploading Video...</span>
</div>

<div class="row">
    <div class="col-md-6">
        <div class="progress hidden">
            <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
                <span id="progress_label">0%</span>
            </div>
        </div>
    </div>
</div>

</form>

Javascript：

    $('form').submit( function( e ) {
    formData = new FormData( this );
    $.ajax({
        xhr: function() {
            var xhr = new window.XMLHttpRequest();

            xhr.upload.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                   var percentComplete = evt.loaded / evt.total;
                   percentComplete = parseInt(percentComplete * 100);
                   percentShown = percentComplete*0.98;
                   showProgress(percentShown);
                }
            }, false);

            return xhr;
        },
        url: '{{Request::url()}}/process',
        type: 'POST',
        data: formData,
        processData: false,
        contentType: false
    }).done(function(data) {
        if (data[0] == 0) {
            console.log( data[1][0] );
            console.log( data[2] );
            $('#feedback').html(data[1][0]).removeClass("hidden");
            $('#key_video').removeClass("hidden");
            $("#uploading_feedback").addClass("hidden");
            $(".progress").addClass("hidden");
        }
        else if (data[0] == 1) { 
            window.location.assign(data[1]);
        }
    });
    e.preventDefault();
});

【问题讨论】：

控制台中是否显示任何消息？检查网络选项卡：你看到 POST 请求了吗？它有什么状态？
没有看到控制台错误。呼叫显示在网络选项卡中。返回 200 响应。我知道这是真的，因为服务器接收请求并接收数据，除了文件。有没有办法在网络标签中显示上传内容？

标签： javascript php ajax xmlhttprequest form-data

【解决方案1】：

如果您的代码在测试服务器上运行，则只需检查文件夹权限和文件夹位置。权限应该是 777。

谢谢

【讨论】：

哇，首先，对于那些略读这个的人。你不应该 777 任何东西。其次，该文件永远不会通过 POST 接收，因此不会出现权限错误。