网站功能小Demo——图片文件上传
网站建设的过程中,经常会遇到文件上传功能,例如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 }
图片上传功能至此结束。功能本身并没有什么难度,扩展一下可以上传不同类型的文件,也可以尝试多文件上传。希望大家能发散思维,做更多的尝试,对知识进行发掘的过程总是美好的!