FileUpload控件文件上传、扩容、限制文件类型及上传验证

首先，文件上传需要使用FileUpload控件，针对于此控件我们来进行一系列的操作。

1、将选中文件上传到目标位置：

<span style="white-space:pre">	</span>//获取上传文件的文件名称
        string name = FileUpload1.FileName;
        //将文件名称拼接成为想要的相对路径
        string path = "images/" + DateTime.Now.ToString("yyyyMMddhhmmss") + name;
        //执行另存为方法，但是这里需要绝对路径，那么使用路径映射
        FileUpload1.SaveAs(Server.MapPath(path));

2、上传文件默认大小限制为4MB，可以扩容，方式为：

<span style="white-space:pre">	</span>//在Web.config配置文件中的system.web标记中增加以下代码，最大长度默认为4096，单位为KB，下面为扩容10倍

  <span style="white-space:pre">	</span><system.web>
  <span style="white-space:pre">	</span>  <httpRuntime maxRequestLength="40960"/>
 <span style="white-space:pre">	</span></system.web>

3、限制浏览文件的类型：

<span style="white-space:pre">	</span><!--限制浏览文件的类型，添加accept属性-->
        <asp:FileUpload ID="FileUpload1" runat="server" accept=".png,.jpg,.jpeg" />

4、上传验证：

分为两种方式，服务端验证会刷新页面，客户端使用js验证则不会刷新页面，推荐使用js验证。

服务端：

<span style="white-space:pre">	</span>//使用以下方式可以获取上传文件的长度，单位为B
        if (FileUpload1.PostedFile.ContentLength > (4 * 1024 * 1024))
        {
            Label1.Text = "文件超过4M！";
            return;
        }

客户端：

<script type="text/javascript">
        window.onload = function () {
            //上传按钮点击事件
            document.getElementById('btn1').onclick = function () {
                //取到file元素
                var fl1 = document.getElementById('file1');
                //判断是否有选中文件
                if (fl1.value.length <= 0)
                {
                    alert('请选择要上传的文件！');
                    return false;
                }
                //获取文件长度并进行判断
                if (fl1.files[0].size > (4 * 1024 * 1024)) {
                    alert('文件超过4M！');
                    return false;
                }

<span style="white-space:pre">		</span>//验证结尾扩展名是否正确
                if (fl1.value.substr(fl1.value.length-4)!='.jpg' || fl1.value.substr(fl1.value.length-5)!='.jpeg' || fl1.value.substr(fl1.value.length-4)!='.png')
                {
                    alert('选择的不是图片文件！');
                    return false;
                }
            };
        };
    </script>