[翻译]运用HtmlInputFile服务器控件上传多个文件-阿里云开发者社区

[翻译]运用HtmlInputFile服务器控件上传多个文件

2017-11-22 1269

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

由于发现以前写的文章都是乱来的，想到什么就写什么？看到别人的文章何等地规范，又通俗易懂，条理又很强，于是乎我就想了一个方法，来训练一下自己的写作方式，通过翻译一些老外的文章来玩玩，可能不断格式化自己可以写出格式不错的文章来，费话不用多说的，今天来翻译一篇比较简单的文章来做为这个计划的开始，OK！运用HtmlInputFile服务器控件上传多个文件[Upload multiple files using HtmlInputFile control]。

  Published: 05 Feb 2006
By: Haissam Abdul Malak

在这篇文章中，我将讲述如何应用几个文件上传控件。本文将通过三个HtmlInputFile服务器控件同时上传三个文件的例子来讲述。

摘要：

当微软发布ASP.NET 1.0时就可以将本地文件上传到WEB服务器上，这通过HTML input file服务器控件就能够实现这样的操作，Html Input File服务器控件可以允许用户浏览本地文件。

现在让我们添加三个Html input file服务器控件，使得用户能够同时选取三个文件，并添加一个按扭Batch Upload，用于提交事件，使得三个文件上传到服务端。同时我们将过滤上传的文件，分别放在两类中：

    1.图片

     2.其它

我们将创建两个文件夹放于程序的根目录中，第一个命名为“Images”用于放置（JPG，GIF）文件，第二个为“Others”用于保存除以上两种文件以外有文件。

HTML代码

让我们来看一下，加入了三个HTML INPUT File服务器控件的HTML代码，代码如下：

<% @ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false"
2

Inherits="MultipleUpload.WebForm1" %>
3

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
4

< HTML >
5

< HEAD >
6

< title > WebForm1 </ title >
7

< meta name ="GENERATOR" Content ="Microsoft Visual Studio .NET
8

7.1" >
10

< meta name ="CODE_LANGUAGE" Content ="C#" >
11

< meta name ="vs_defaultClientScript" content ="JavaScript" >
12

< meta name ="vs_targetSchema"
13

content ="http://schemas.microsoft.com/intellisense/ie5" >
14

</ HEAD >
15

< body MS_POSITIONING ="GridLayout" >
16

< form id ="Form1" method ="post" runat ="server" >
17

< asp:Button id ="Button1" style ="Z-INDEX: 101; LEFT: 280px;
18

POSITION: absolute; TOP: 101px" runat ="server" Text ="Batch Upload" />
19

< div id ="Div1" runat ="server" style ="Z-INDEX:102;LEFT:165px;WIDTH:1026px;
20

POSITION:absolute;TOP:7px;HEIGHT:19px" >
21

< INPUT id ="FileUpload1" style ="WIDTH: 389px; HEIGHT: 22px"
22

type ="file" size ="45" runat ="server" >
23

< asp:Label id ="Label1" runat ="server" Width ="598px"
24

ForeColor ="Red" />
25

</ div >
26

< div id ="Div2" runat ="server" style ="Z-INDEX:103;LEFT:166px;WIDTH:1026px;
27

POSITION:absolute;TOP:38px;HEIGHT:19px" >
28

< INPUT style ="WIDTH: 389px; HEIGHT: 22px" type ="file"
29

size ="45" runat ="server" id ="FileUpload2" >
30

< asp:Label id ="Label2" runat ="server" Width ="357px"
31

ForeColor ="Red" />
32

</ div >
33

< div id ="Div3" runat ="server" style ="Z-INDEX:104;LEFT:166px;WIDTH:1026px;
34

POSITION:absolute;TOP:68px;HEIGHT:19px" >
35

< INPUT style ="WIDTH: 389px; HEIGHT: 22px" type ="file"
36

size ="45" runat ="server" id ="FileUpload3" >
37

< asp:Label id ="Label3" runat ="server" Width ="361px"
38

ForeColor ="Red" />
39

</ div >
40

</ form >
41

</ body >
42

</ HTML >
43

以下图片显示以上代码解析后的浏览器显示的样式：

Code Behind

为了上传文件我们需要用到以下几个类：

    1.HttpFileCollection

    2.HttpPostedFile

    3.Request.Files

    4.System.IO.Path

HttpFileCollection类包含了一系列的HttpPostedFile，为上传服务器文件的一个集合，为了取得用户所选的文件我们要运用到Request.Files，它将返回一个文件集合保存于HttpFileCollection对象中。运用System.IO.Path来判断文件的扩展名以及文件名，我们将通过扩展名来将文件分成两类。

HttpFileCollection uploadFilCol = Request.Files;
2

for ( int i = 0 ;i < uploadFilCol.Count;i ++ )
3

{
4

HttpPostedFile file = uploadFilCol[i];
5

string fileExt = Path.GetExtension(file.FileName).ToLower();
6

string fileName = Path.GetFileName(file.FileName);
7

if(fileName != string.Empty)
8

{
9

try
10

{
11

if(fileExt == ".jpg" || fileExt == ".gif")
12

{
13

file.SaveAs(Server.MapPath("./Images/") + fileName);
14

}
15

else
16

{
17

file.SaveAs(Server.MapPath("./Others/") + fileName);
18

}
19

}
20

catch(Exception ex)
21

{
22

throw ex;
23

}
24

}
25

}

你可能发现我们通过Foreach从HttpFileCollection集合中取得HttpPostFile对象，将扩展名保存在fileExt变量中，将文件名保存在fileName变量中。然后我们判断它是个图片文件，通过HttpPostFile.SaveAs()方法来将上传的文件保存在“Images”文件夹下，将其它文件保存在还有一个文件夹“Others”下。

下一步我们将创建一个方法ShowMessages（）用来显示上传的状态：

private void ShowMessage( string message, int fileUploadPos )
2

{
3

if(fileUploadPos ==0)
4

{
5

Label1.Text = message;
6

}
7

else
8

{
9

if(fileUploadPos ==1)
10

{
11

Label2.Text = message;
12

}
13

else
14

{
15

Label3.Text = message;
16

}
17

}
18

}

ShowMessage方法共有两个参数，第一个参数是用于显示的字符串，第个个参数是HttpFileCollection的集合索引。

这个方法将用于显示上传各个文件的状态作息，以及判断是否返回一个错误信息，下面的截图显示上传成功后的状态信息：

完整代码：

HttpFileCollection uploadFilCol = Request.Files;
2

for ( int i = 0 ;i < uploadFilCol.Count;i ++ )
3

{
4

HttpPostedFile file = uploadFilCol[i];
5

string fileExt = Path.GetExtension(file.FileName).ToLower();
6

string fileName = Path.GetFileName(file.FileName);
7

if(fileName != string.Empty)
8

{
9

try
10

{
11

if(fileExt == ".jpg" || fileExt == ".gif")
12

{
13

file.SaveAs(Server.MapPath("./Images/") + fileName);
14

this.ShowMessage(" " + fileName + " Successfully Uploaded",i);
15

}
16

else
17

{
18

file.SaveAs(Server.MapPath("./Others/") + fileName);
19

this.ShowMessage(" " + fileName + " Successfully Uploaded",i);
20

}
21

}
22

catch(Exception ex)
23

{
24

this.ShowMessage(" " + ex.Message, i);
25

}
26

}
27

}

为了能够正常的运行，有两个要点需要我们注意：

1.如果你需要上传的文件超过4MB就需要修改配制文件Web.config中的<httpRuntime>节点的maxRequestLength属性的值，请注意单位为KB。

2.必需给ASPNET用户帐户能够上传文件到刚创建的两个文件夹的权限。

总结：

在这篇文章中，你可以看到HTML file服务器控件的强大之处，将代码加入到你的应用程序中就可以让用户同时上传多个文件到Web服务器中。

本文转自网魂小兵博客园博客，原文链接：http://www.cnblogs.com/xdotnet/archive/2007/03/07/translate_upload_files_using_htmlfileinput.html，如需转载请自行联系原作者

[翻译]运用HtmlInputFile服务器控件上传多个文件

热门文章

最新文章

相关课程

相关电子书

相关实验场景

热门

活动广场

任务中心

开发者评测

高校计划

乘风者计划

训练营

阿里云MVP

话题

直播

下载

镜像站

技术资料

插件

[翻译]运用HtmlInputFile服务器控件上传多个文件

热门文章

最新文章

相关课程

相关电子书

相关实验场景