上传图片是日常开发中经常遇到的,近日经理给我分配了一个任务,就是实现图片的上传。其实之前也做过上传的功能,当时没有具体的实现,仅仅做了一部分了解。不过,这样最起码已经给自己增加了一份信心,至少不会不知所措了。下面就来说一下关于上传图片实现的内容。

    幸运的是,公司已经有模块实现了该功能,我呢也只需搬搬砖就行了。但是搬完砖之后,可不能仅仅如此而已。查找了一些相关的资料,自己动手做了一个简单的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文件,可以帮助我们来完成复杂的功能。通过这次实现,给了自己很大的信心,无论功能的完美与否都是次要的,最主要的是通过它来激发我们求知的欲望。


 posted on 2016-06-28 18:40  走出自己的未来  阅读(1772)  评论(0编辑  收藏  举报