在C#中利用plupload插件进行http文件上传

最新推荐文章于 2022-02-17 15:34:37 发布

侯小北北北北北

最新推荐文章于 2022-02-17 15:34:37 发布

阅读量2.9k

点赞数 1

分类专栏： C# WEB 文章标签： c# http上传文件 plupload

本文链接：https://blog.csdn.net/houshubin/article/details/53195249

版权

C# 同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

WEB

5 篇文章 0 订阅

订阅专栏

这一块是很苦逼的啦，关联性很多，需要改动的也跟多，不过只要想到了很多东西大家可以百度到，好啦，不说废话了。。。。。

一 . 先说一说配置吧，毕竟插件用的再溜，理解的再深刻没配置好那也是白搭。

可能是由于安全性吧，web.config中默认的上传文件的大小为4096KB，也就是差不多4M吧，相对于一般的文本文件还是可以得，毕竟文字占内存小，但是稍微还算有点分量的图片就不够了。所以需要更改上传文件的大小，如下：

先在web.config中找到<system.web>标签，然后在<system.web>标签中找到<httpRuntime>标签，在<httpRuntime>标签中加上executionTimeout="XXXX" maxReuquestLength="XXXXXX",在这解释一下添加的这两个东西的意思：

（1）executionTimeout="XXXX"：设置asp.net超时时间，单位：S（秒），说的直白点就是上传文件的时间不能超过这个时间，一旦超过了就报错。

（2）maxReuquestLength="XXXXXX"：设置上传文件的大小，单位：KB

注意：可能有时候设置了上传文件的大小也不一定管用，那么就需要修改IIS中上传文件大小的限制了，具体如下：
（1）首先，关掉iis进程，即把inetinfo.exe进程关掉。（别找错了是进程，不是服务，所以在windows管理器中）
（2）在C盘中找到：windows/system32/inesrv/metabase.xml”文件,打开，Ctrl+F 找到AspMaxRequestEntityAllowed="204800"这一项，即iis上传文件的默认大小，默认为204800Byte，也就是200KB，将它修改为合适的大小即可。

二 .配置好了，那咱就说一下插件吧

Plupload中文帮助文档：http://www.phpin.net/tools/plupload/

另还有一个良心的代码：http://pluploadmvc4demo.codeplex.com/SourceControl/latest

有不懂得可以参考上边两部分，我直接上代码了

<tr>

<tr>

</table>

<div id="container">
       <a id="pickfiles" href="javascript:;">[Select files]</a>
       <a id="uploadfiles" href="javascript:;">[Upload files]</a>
</div>

   <br />
    <script type="text/javascript">

function fremove(a){

uploader.removeFile($(a).parent().parent()[0].id);

$(a).parent().parent().remove();

}
    <pre id="console"></pre>
        // Custom example logic

       var uploader = new plupload.Uploader({
           runtimes: 'html5,flash,silverlight,html4',
           browse_button: 'pickfiles', // you can pass in id...
           container: document.getElementById('container'), // ... or DOM Element itself
           url: '../../api/Upload',//注意一下这地方，待会说
           flash_swf_url: 'Scripts/Moxie.swf',
           silverlight_xap_url: 'Scripts/Moxie.xap',
           multipart_params:{"IP":"XXX.XXX.XXX.XXX","savePath":"d:"},//上传的时候带的参数,可以根据需求自己设置

multipart:true,

           dragdrop:true,
            filters: {
               max_file_size: '10mb',//一般可为KB，MB，GB
                mime_types: [//可上传的类型，title仅仅只是代表一个上传类型的名字
                   { title: "Image files", extensions: "jpg,gif,png" },
                   { title: "Zip files", extensions: "zip" }
               ]
           },

           init: {
               PostInit: function () {
                   document.getElementById('filelist').innerHTML = '';

                   document.getElementById('uploadfiles').onclick = function () {
                       uploader.start();
                       return false;
                   };
               },

               FilesAdded: function (up, files) {
                   plupload.each(files, function (file) {
                       //document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' +

//file.name + ' ('+plupload.formatSize(file.size) + ') <b></b></div>';

var rowdata='<tr id="'+file.id+'"><td>'+file.name+'</td><td>('+plupload.formatSize(file.size)+

')</td><td><b></b></td><td style="width:30px;"><a href="#" οnclick="fremove(this);">'+

                        '<span>删除</span></a></td></tr>';
                    });
               },

               UploadProgress: function (up, file) {
                   document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
               },

               Error: function (up, err) {
                   document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message;
               }
           }
       });

       uploader.init();

后台UploadController:

public class UploadController:ApiController//必须继承这个控制器

{

public HttpResponseMessage Upload()

{

string savePath="";

if(HttpContext.Current.Request.Form["savePath"]!=null &&

HttpContext.Current.Request.Form["savePath"]!="")

{

savePath=HttpContext.Current.Request.Form["savePath"].ToString();

}

if(HttpContext.Current.Request.Files.Count>0)

{

if(!Directory.Exists(savePath))

{

Directory.CreateDirectory(savePath);

}

string exp="";

HttpPostedFile files=HttpContext.Current.Request.Files[0];

exp=Path.GetExtension(file.FileName);

string newFileName=file.FileName;

//string fileSize=(file.ContentLength/1024).ToString();//文件大小

newFileName=DateTime.Now.ToString("yyyyMMddHHmmss")+"_V1.0"+exp;

file.SaveAs(savePath+"\\"+newFileName);

HttpContext.Current.Response.ContentType="text/plain";

var serialzer=new System.Web.Script.Serialization.JavaScriptSerializer();

var result=new{name=""};

HttpContext.Current.Response.Write(serialzer.Serialize(result));

HttpContext.Current.Response.StatusCode=200;

return new HttpResponseMessage(HttpStatusCode.OK);

}

else

{

HttpContext.Current.Response.ContentType="text/plain";

var serialzer=new System.Web.Script.Serialization.JavaScriptSerializer();

var result=new{name="fail"};

HttpContext.Current.Response.Write(serialzer.Serialize(result));

HttpContext.Current.Response.StatusCode=404;

return new HttpResponseMessage(HttpStatusCode.NotFound);

}

return new HttpResponseMessage(HttpStatusCode.NotFound);

}

下面说一下上面的url,很明显上边的Controller中没有涉及到任何带api的路径，

但是url中添加了api这个路径，这是为什么呢？

因为新建WEB项目的时候会自动添加一个专门用于http的路由，上边的路径添加了api,代码如下

1.在App_Start中一个名字为WebApiConfig的类

    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }