Javascript 无法将附加文件传递给控制器：422无法处理的实体

我使用Dropzone js处理多个文件上传。但是，这些文件不会传递给控制器。通过添加CSRF令牌的头代码解决419 post错误后，出现422个不可处理实体错误

根据网络日志上的响应，它似乎影响了我之前工作正常的其他字段中的验证

{"message":"The given data was invalid.","errors":{"item-name.0":["The item-
name.0 field is required."],"item-quantity.0":["Please Enter Item 
Quantity."],"availableStartDate":["The available start date field is 
required."],"availableEndDate":["The available end date field is 
required."],"preferredTime":["The preferred time field is required."]}}

以下是Blade文件顶部的Javascript代码

 <script type="text/javascript">
    Dropzone.autoDiscover = false;
    $(document).ready(function () {
        new Dropzone('#fileInput', {
            autoProcessQueue: false,
            uploadMultiple: true,
            parallelUploads: 1000,
            maxFiles: 100,
            acceptedFiles: ".jpeg,.jpg,.png,.gif",
            url: '/make-a-donation',
            addRemoveLinks:true,
            headers: {
                'X-CSRFToken': $('meta[name="token"]').attr('content')
            },

            init: function () {

                var myDropzone = this;
                var wrapperThis = this;
                $("#submit-all").click(function (e) {
                    e.preventDefault();
                    myDropzone.processQueue();
                });

                //Removed sending and success functions respectively

            }
        });
    });
</script>

---

问题1

您的提交处理程序选择器是

#全部提交
：

$("#submit-all").click(function (e) {

但是您的按钮没有该ID（其他任何东西也没有）：

问题4

接下来，在您的
success
回调中，您试图以
e
的形式访问Javascript事件，以及上载的
文件
，但两者都没有定义，因此将抛出错误，POST响应可用作第二个参数，但我不确定第一个参数是什么（控制台日志显示它是某种Dropzone对象）

但请注意，文档中也会说：

除非您知道自己在做什么，否则不要将其作为配置选项覆盖

我将完全删除
success
回调。如果要在成功上载后删除文件，请执行以下操作：

解决了这些问题，我让您的代码在本地环境中正常工作

另一件事，我不确定这是否只是一个打字错误，或者你的代码中是否真的有这个错误，但是你的回退文件输入中缺少了一个介于
多个
和它的
id
之间的空格，这可能会在需要时把它搞砸：

multiple="multiple"id="fileUpload"

更新以回答新问题5

对于您的新问题，
419
通常是bcs，因为您的CSRF令牌检查失败。这里有几个例子说明了解决方案，所以：

对于我自己的一个项目，我使用Dropzone
发送
回调在发布的数据中包含其他表单输入：

this.on('sending', function(file, xhr, formData) {
    // Append all form inputs to the formData Dropzone will POST
    var data = $('form').serializeArray();
    $.each(data, function(key, el) {
        formData.append(el.name, el.value);
    });
});

更新以回答新问题6

对于您的新问题：

现在它导致另一个错误：422个不可处理的实体

用于验证失败的AJAX请求

因此，听起来像是a）表单中的字段比显示的多，b）对它们进行验证。目前，您只发布文件，没有其他内容，因此验证自然会失败

在这种情况下，您需要在帖子中包含其他字段。您可以通过将它们附加到
formData
，如我上次更新中包含的
sending
回调中所示。
form
enctype
？@skido已经在表单中添加了enctype=“multipart/form data”tag@Enovyne我的更新有用吗？@别惊慌。现在它会导致另一个错误：422个不可处理的实体。现在您只发布文件。如果此表单中有其他字段，并且验证需要这些字段，则需要在发布的数据中包含这些值。您可以通过上次更新中包含的
发送
回调来实现这一点。我在submit按钮上无意中省略了submit all id。即使有身份证，它也只是停留在页面上。加载资源失败：服务器响应状态为419（未知状态）。有几个问题，我已更新了答案以解决所有问题。感谢您的输入@不要惊慌。我在这里更新了我当前的代码，因为我仍然面临同样的问题。@Enovyne您更新的代码对我有效，尽管我没有测试您的控制器代码，只是文件已正确发布，服务器收到了预期的数据<代码>“为foreach（）提供的显示参数”
不是我见过的错误消息，它也没有出现在Google中。它真的是你所看到的吗？是什么在抛出它，PHP还是JS？另外，您确定找到了正确的控制器/方法吗？浏览器开发工具显示了什么（检查网络和控制台）？错误消息“为foreach（）提供的参数不再显示”。这是针对PHP代码的。在控制台中，它显示加载资源失败：服务器响应状态为419（未知状态），这非常奇怪。它只是停留在页面上。
<button type="submit" class="btn btn-primary">

foreach ($r->file('file') as $file) {

myDropzone.on("complete", function(file) {
  myDropzone.removeFile(file);
});

multiple="multiple"id="fileUpload"

this.on('sending', function(file, xhr, formData) {
    // Append all form inputs to the formData Dropzone will POST
    var data = $('form').serializeArray();
    $.each(data, function(key, el) {
        formData.append(el.name, el.value);
    });
});