上传图片是日常开发中经常遇到的,近日经理给我分配了一个任务,就是实现图片的上传。其实之前也做过上传的功能,当时没有具体的实现,仅仅做了一部分了解。不过,这样最起码已经给自己增加了一份信心,至少不会不知所措了。下面就来说一下关于上传图片实现的内容。
幸运的是,公司已经有模块实现了该功能,我呢也只需搬搬砖就行了。但是搬完砖之后,可不能仅仅如此而已。查找了一些相关的资料,自己动手做了一个简单的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文件,可以帮助我们来完成复杂的功能。通过这次实现,给了自己很大的信心,无论功能的完美与否都是次要的,最主要的是通过它来激发我们求知的欲望。