上传图片是日常开发中经常遇到的,近日经理给我分配了一个任务,就是实现图片的上传。其实之前也做过上传的功能,当时没有具体的实现,仅仅做了一部分了解。不过,这样最起码已经给自己增加了一份信心,至少不会不知所措了。下面就来说一下关于上传图片实现的内容。
幸运的是,公司已经有模块实现了该功能,我呢也只需搬搬砖就行了。但是搬完砖之后,可不能仅仅如此而已。查找了一些相关的资料,自己动手做了一个简单的demo,分享一下。
具体实现:
页面设计:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="UploadImg.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> <form id="form1" runat="server"> <div> <table> <tr> <td colspan="2" style="height: 21px"> </td> </tr> <tr> <td style="width: 400px"> <asp:FileUpload ID="FileUpload1" runat="server" /> <asp:Label ID="label1" runat="server" ForeColor="Red"></asp:Label> </td> <td style="width: 80px"> <asp:Button ID="UploadButton" runat="server" Text="上传图片" OnClick="UploadButton_Click" /> </td> </tr> <tr> <td colspan="2" align="center"> <br /> <br /> <asp:Image ID="Image1" runat="server" Height="118px" Width="131px" /> </td> </tr> </table> </div> </form> </body> </html>后台实现代码:
protected void UploadButton_Click(object sender, EventArgs e) { try { OracleConnection oraCon = new OracleConnection(connString); //using (OracleConnection = new OracleConnection(connString)) //{ string FullName = FileUpload1.PostedFile.FileName;//获取图片物理地址 FileInfo fi = new FileInfo(FullName); string name = fi.Name;//获取图片名称 string type = fi.Extension;//获取图片类型 if (type == ".jpg" || type == ".gif" || type == ".bmp" || type == ".png") { string SavePath = Server.MapPath("~\\excel");//图片保存到文件夹下 this.FileUpload1.PostedFile.SaveAs(SavePath + "\\" + name);//保存路径 this.Image1.Visible = true; this.Image1.ImageUrl = "~\\excel" + "\\" + name;//界面显示图片 string sql = "insert into test(name,course,score) values('" + name + "','" + type + "','~\\excel" + name + "')"; OracleCommand cmd = new OracleCommand(sql, oraCon); oraCon.Open(); cmd.ExecuteNonQuery(); this.label1.Text = "上传成功"; } else { this.label1.Text = "请选择正确的格式图片"; } //} } catch (Exception ex) { Response.Write(ex.Message); } }最终的实现效果:
其实上传图片最主要的就是关于路径的问题,一般情况下获取本地的路径是最容易的,但是在项目中我们往往需要的是获取服务器的路径,这样才能实现文件的共享。(本demo暂时没有做相关的获取)
小结:
掌握好上传下载的基本原理,对于实现上就简单多了。 而且也有关于实现上传的现成的一些js文件,可以帮助我们来完成复杂的功能。通过这次实现,给了自己很大的信心,无论功能的完美与否都是次要的,最主要的是通过它来激发我们求知的欲望。