首页 > 技术文章 > 网站功能小Demo——图片文件上传

SunshineAgain 2017-03-20 14:38 原文

  网站建设的过程中,经常会遇到文件上传功能,例如Word文档、Excel表格、图片等文件。这一实用的小功能如何实现的呢!我们一起来探究。

  在ASP.NET中,文件上传功能用到了FileUpload组件。下面就用图片的上传功能演示整个上传过程。

  前台设置好FileUpload组件:

1 <body>
2     <form id="form1" runat="server">
3     <div class="div_align">
4         <asp:FileUpload id="Up_Image" runat="server" CssClass="File_Load" />
5         <asp:Button ID="btn_save" runat="server" Text="上传" CssClass="Submit_btn" OnClick="btnSave_Click"/>
6     </div>
7     </form>
8 </body>

    

  大致效果如下(项目开发过程中需要美观可以定义一些自己喜欢的样式):

  后台流程处理:后台获取所选文件的文件名,并进行扩展名验证,验证上传文件是否为常用的jpg,jpeg,png等常用图片格式。为了使得上传文件唯一,将当前系统文件作为文件新名称。设置好文件存放路径后调用SaveAs( )方法即可完成上传流程。

 1 /// <summary>
 2         /// 文件上传流程(获取文件名->后缀名验证->获取保存路径->提交保存)
 3         /// </summary>
 4         /// <param name="sender"></param>
 5         /// <param name="e"></param>
 6         protected void btnSave_Click(object sender, EventArgs e)
 7         {
 8             //获取上传文件名
 9             string str = Up_Image.FileName;
10 
11             if (string.IsNullOrEmpty(str))
12             {
13                 ClientScript.RegisterStartupScript(this.GetType(), "message", "<script>alert('上传失败:尚未选择提交文件!')</script>");
14 
15                 return;
16             }
17 
18             //获取文件扩展名
19             string extension = Path.GetExtension(Up_Image.PostedFile.FileName);
20 
21             //ClientScript.RegisterStartupScript(this.GetType(),"message", "<script>alert('"+last+"')</script>");
22 
23             if (extension != ".jpg" && extension != ".png" && extension != ".jpeg")
24             {
25                 ClientScript.RegisterStartupScript(this.GetType(),"message", "<script>alert('上传文件格式必须为图片(jpg、jpeg、png等)格式!')</script>");
26 
27                 return;
28             }
29 
30             //获取当前时间作为文件名
31             string Time_Now = DateTime.Now.ToString("yyMMddHHMMss");
32 
33             string imageName = Time_Now + extension;
34 
35             //获取目标文件夹路径作为图片存放路径
36             string strUpPath = Server.MapPath("~/Image_File/") + imageName;
37             try
38             {
39                 //上传图片
40                 Up_Image.SaveAs(strUpPath);
41 
42                 ClientScript.RegisterStartupScript(this.GetType(), "message", "<script>alert('上传成功!')</script>");
43             }
44             catch (Exception ex)
45             {
46                 ClientScript.RegisterStartupScript(this.GetType(), "message", "<script>alert('上传失败,请联系管理员!')</script>");
47             }
48         }

  
  图片上传功能至此结束。功能本身并没有什么难度,扩展一下可以上传不同类型的文件,也可以尝试多文件上传。希望大家能发散思维,做更多的尝试,对知识进行发掘的过程总是美好的!

推荐阅读