Question

我必须使用dropzone上传ZIP存档，当我选择存档时，我看到进度条从0到100，但请求永远不会到达服务器，我在表单中指定的操作永远不会被调用。这是我页面上的文件上传器：

<form action="URL_ACTION" class="dropzone dropzone-file-area" id="dropzoneZip" method="post" enctype="multipart/form-data">
  <div class="fallback">
     <input name="file" type="file" />
     <input type="submit" value="Upload" name="upload" />
  </div>
</form>

这是我的JS代码：

Dropzone.options.dropzoneZip = {
        dictDefaultMessage: "Drag files here o click to upload",
        maxFiles: 1,
        acceptedFiles: ".zip",
        init: function () {
            this.on("error", function (file, errorMessage) {
                alert("error : " + errorMessage);
            });
            this.on("addedfile", function (e) {
                var n = Dropzone.createElement("<a href='javascript:;' class='btn red btn-sm btn-block'>Remove</a>"),
                    t = this;
                n.addEventListener("click", function (n) {
                    n.preventDefault(), n.stopPropagation(), t.removeFile(e)
                }), e.previewElement.appendChild(n)
            }),
            this.on("complete", function (data) {
                if (data.xhr.responseText == "success") {
                    swal({
                        title: 'Success',
                        text: 'File uploaded',
                        type: "success"
                    }).then(
                    function () {
                        $(".se-pre-con").fadeIn("slow");
                        location.reload();
                    })
                }
            }),
            this.on('error', function (file, errorMessage) {
                if (errorMessage != "success") {
                    var errorDisplay = document.querySelectorAll('[data-dz-errormessage]');
                    errorDisplay[errorDisplay.length - 1].innerHTML = errorMessage;
                }
                else if (errorMessage.indexOf('404') !== -1) {
                    var errorDisplay = document.querySelectorAll('[data-dz-errormessage]');
                    errorDisplay[errorDisplay.length - 1].innerHTML = 'Error 404: The upload page was not found on the server';
                } else if (errorMessage.indexOf('500') !== -1) {
                    var errorDisplay = document.querySelectorAll('[data-dz-errormessage]');
                    errorDisplay[errorDisplay.length - 1].innerHTML = 'Error 500: Internal server error';
                }
            });
        }
    }

这是我的操作代码，我检查文件类型：

  if (Request.Files != null && Request.Files.Count > 0)
  {
      if (Request["type"]=="zip" && (Request.Files[0].ContentType == "application/x-compressed" || Request.Files[0].ContentType == "application/x-zip-compressed" || Request.Files[0].ContentType == "application/zip" || Request.Files[0].ContentType == "multipart/x-zip"))
        uploadZip();
  }

但是从未达成过这个行动。我尝试使用相同的方法上传图像，它正常工作。我无法弄清楚我做错了什么

Answer 1

的index.html

<html>

<head>   
<script
  src="https://code.jquery.com/jquery-3.2.1.js"
  integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
  crossorigin="anonymous"></script>
<!-- 1 -->
<link href="dropzone.css" type="text/css" rel="stylesheet" />

<!-- 2 -->
<script src="dropzone.min.js"></script>
<style>
    .dropzone .dz-preview {
        display:none;
    }

</style>
</head>

<body>


<form  action="upload.php" class="dropzone dropzone-file-area" id="dropzoneZip" method="post" enctype="multipart/form-data">
    <div class="fallback">
     <input name="file" type="file" />

  </div>
</form><input type="submit" value="Upload" name="upload" id="submit-all" />

<script>

Dropzone.options.myDropzone = {

  // Prevents Dropzone from uploading dropped files immediately
  autoProcessQueue: false,

  init: function() {
    var submitButton = document.querySelector("#submit-all")
        myDropzone = this; // closure

    submitButton.addEventListener("click", function() {
      myDropzone.processQueue(); // Tell Dropzone to process all queued files.

    });

    // You might want to show the submit button only when 
    // files are dropped here:
    this.on("addedfile", function() {
      // Show submit button here and/or inform user to click it.

    });

  }
};
</script></body></html>

update.php

<?php
$ds          = DIRECTORY_SEPARATOR;  //1

$storeFolder = 'uploads';   //2

if (!empty($_FILES)) {

    $tempFile = $_FILES['file']['tmp_name'];          //3             

    $targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds;  //4

    $targetFile =  $targetPath. $_FILES['file']['name'];  //5

    move_uploaded_file($tempFile,$targetFile); //6

}
?>

如果你有xamp / uniserver然后它完全正常工作，我已经测试了上面的代码为上传服务器中文件的地方创建一个上传文件夹

Answer 2

好的，我发现了原因：我尝试上传的文件超出了Web.config文件中的maxRequestLength参数。使用较小的文件，上传工作正常

Dropzone.js不会上传.zip文件

2 个答案: