jQuery Image上传到MVC5

时间:2014-03-11 17:41:03

标签: c# javascript jquery asp.net-mvc file-upload

我目前在服务器端API中有以下代码:

 // Enable both Get and Post so that our jquery call can send data, and get a status
        [System.Web.Mvc.HttpGet]
        [System.Web.Mvc.HttpPost]
        public HttpResponseMessage Upload()
        {
            // Get a reference to the file that our jQuery sent.  Even with multiple files, they will all be their own request and be the 0 index
            HttpPostedFile file = HttpContext.Current.Request.Files[0];

            // do something with the file in this space 
            // {....}
            // end of file doing

            // Now we need to wire up a response so that the calling script understands what happened
            HttpContext.Current.Response.ContentType = "text/plain";
            var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
            var result = new { name = file.FileName };

            HttpContext.Current.Response.Write(serializer.Serialize(result));
            HttpContext.Current.Response.StatusCode = 200;

            // For compatibility with IE's "done" event we need to return a result as well as setting the context.response
            return new HttpResponseMessage(HttpStatusCode.OK);
        }

我使用以下jQuery来调用它:

$(function () {
        $('#fileupload').fileupload({
            dataType: "json",
            url: "/api/Upload",
            limitConcurrentUploads: 1,
            sequentialUploads: true,
            progressInterval: 100,
            maxChunkSize: 10000,
            add: function (e, data) {
                $('#filelistholder').removeClass('hide');
                data.context = $('<div />').text(data.files[0].name).appendTo('#filelistholder');
                $('</div><div class="progress"><div class="bar" style="width:0%"></div></div>').appendTo(data.context);
                $('#btnUploadAll').click(function () {
                    data.submit();
                });
            },
            done: function (e, data) {
                data.context.text(data.files[0].name + '... Completed');
                $('</div><div class="progress"><div class="bar" style="width:100%"></div></div>').appendTo(data.context);
            },
            progressall: function (e, data) {
                var progress = parseInt(data.loaded / data.total * 100, 10);
                $('#overallbar').css('width', progress + '%');
            },
            progress: function (e, data) {
                var progress = parseInt(data.loaded / data.total * 100, 10);
                data.context.find('.bar').css('width', progress + '%');
            }
        });
    });

我遇到的问题是,我不明白我在哪里可以抓取已完成的上传文件。当我添加一个断点时,这个函数在一次图像上传时被称为100次。

有人可以帮我解释为什么会这么叫吗?

我认为最好的方法是确保它只是上传的图像(没有exe,病毒等)。

我只想上传文件,确认它是图像,调整文件大小并按数据库保存为Base64字符串或文件系统?或者

谢谢!

0 个答案:

没有答案