MVC dropzone不会在IE中上传文件

时间:2015-06-25 23:47:17

标签: javascript asp.net asp.net-mvc asp.net-mvc-4 dropzone.js

请帮忙。我正在使用dropzone上传基于此示例http://venkatbaggu.com/file-upload-in-asp-net-mvc-using-dropzone-js-and-html5/的多个文件的MVC项目。

我在Chrome上有这项工作,但我无法弄清楚为什么它不适用于IE 11.当我在VS2013中调试时,它似乎没有触发SaveUploadedFile操作。同样,它适用于Chrome。以下是我的MVC项目中的代码:

查看:

@Styles.Render("~/Content/css")

<div class="container">
  <div class="jumbotron">
    <form action="~/PhotoAlbum/SaveUploadedFile/@Model.AlbumID" method="post" enctype="multipart/form-data" class="dropzone" id="dropzoneForm">
        <div class="fallback">
            <input name="file" type="file" multiple />
            <input type="submit" value="Upload" />
        </div>
    </form>
  </div>
</div> <!-- /container -->   

<style type="text/css">
    .dz-max-files-reached { background-color: red; }
</style>

@section scripts {
  @Scripts.Render("~/bundles/dropzonescripts")

  <script type="text/javascript">
    //File Upload response from the server
    Dropzone.options.dropzoneForm = {
        maxFiles: 20,
        init: function () {
            this.on("maxfilesexceeded", function (data) {
                var res = eval('(' + data.xhr.responseText + ')');

            });
            this.on("onSuccess", function (data) {
                alert("Upload successfully!");
            });
            this.on("onError", function (data) {
                alert("Upload Failed!");
            });
            this.on("addedfile", function (file) {

                // Create the remove button
                var removeButton = Dropzone.createElement("<button class='btn btn-info glyphicon glyphicon-remove-sign'> Remove </button>");

                alert("Upload Failed!");
                // Capture the Dropzone instance as closure.
                var _this = this;

                // Listen to the click event
                removeButton.addEventListener("click", function (e) {
                    // Make sure the button click doesn't submit the form:
                    e.preventDefault();
                    e.stopPropagation();
                    // Remove the file preview.
                    _this.removeFile(file);
                    // If you want to the delete the file on the server as well,
                    // you can do the AJAX request here.
                });

                // Add the button to the file preview element.
                file.previewElement.appendChild(removeButton);
            });
        }
    };

  </script>
}

动作:

public ActionResult SaveUploadedFile(int id)
{
    EZone_PhotoAlbum ezAlbum = repoAlbum.GetPhotoAlbumByID(id);

    bool isSavedSuccessfully = true;
    string fName = "";
    foreach (string fileName in Request.Files)
    {
        HttpPostedFileBase file = Request.Files[fileName];
        //Save file content goes here
        fName = file.FileName;
        if (file != null && file.ContentLength > 0)
        {
            var originalDirectory = new DirectoryInfo(string.Format("{0}\\", Server.MapPath(sMapPath + "\\" + ezAlbum.AlbumFolder)));

            string pathString = System.IO.Path.Combine(originalDirectory.ToString(), "original");

            var fileName1 = Path.GetFileName(file.FileName);

            bool isExists = System.IO.Directory.Exists(pathString);

            if (!isExists)
                System.IO.Directory.CreateDirectory(pathString);

            var path = string.Format("{0}\\{1}", pathString, fileName1);
            file.SaveAs(path);
        }
    }

    if (isSavedSuccessfully)
    {
        return Json(new { Message = fName });
    }
    else
    {
        return Json(new { Message = "Error in saving file" });
    }
}

.Headers:

General:
Remote Address:[::1]:80
Request URL:http://localhost/eZone/PhotoAlbum/SaveUploadedFile/2
Request Method:POST
Status Code:200 OK

Response Headers:    view parsed
HTTP/1.1 200 OK
Cache-Control: private
Content-Type: application/json; charset=utf-8
Server: Microsoft-IIS/7.5
X-AspNetMvc-Version: 5.1
X-AspNet-Version: 4.0.30319
Persistent-Auth: true
X-Powered-By: ASP.NET
WWW-Authenticate: Negotiate oRswGaADCgEAoxIEEAEAAABDh+CIwTbjqQAAAAA=
Date: Fri, 26 Jun 2015 16:01:30 GMT
Content-Length: 26

Request Headers    view parsed
POST /eZone/PhotoAlbum/SaveUploadedFile/2 HTTP/1.1
Host: localhost
Connection: keep-alive
Content-Length: 3501896
Authorization: Negotiate oXcwdaADCgEBoloEWE5UTE1TU1AAAwAAAAAAAABYAAAAAAAAAFgAAAAAAAAAWAAAAAAAAABYAAAAAAAAAFgAAAAAAAAAWAAAABXCiOIGAbEdAAAAD6cslqGeHsjhn4ZY5uX0W2mjEgQQAQAAAPUXp1AtIpqEAAAAAA==
Origin: http://localhost
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.130 Safari/537.36
Content-Type: multipart/form-data; boundary=----WebKitFormBoundarySvGz79kd1fOGLop0
Accept: application/json
Cache-Control: no-cache
X-Requested-With: XMLHttpRequest
Referer: http://localhost/eZone/photoalbum/Detail/2
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.8

Request Payload
------WebKitFormBoundarySvGz79kd1fOGLop0
Content-Disposition: form-data; name="null"

------WebKitFormBoundarySvGz79kd1fOGLop0
Content-Disposition: form-data; name="null"

------WebKitFormBoundarySvGz79kd1fOGLop0
Content-Disposition: form-data; name="file"; filename="IMG_0057.JPG"
Content-Type: image/jpeg
------WebKitFormBoundarySvGz79kd1fOGLop0--

.Response:

  

{&#34;消息&#34;:&#34; IMG_0057.JPG&#34;}

0 个答案:

没有答案