Asp.Net怎么上傳圖片-基礎教程

aspx頁面

script方法內用於判斷用戶上傳的文件是否為自己要求的格式和展示圖片的方法

body內定義一個圖片框用於預覽用戶上傳的圖片

一個上傳文件的控件

一個提交按鈕

代碼如下

Script代碼：

$(function () { $('#uploadImage').on('change', function () { var filePath = $(this).val() //獲取到input的value，里面是文件的路徑
                fileFormat = filePath.substring(filePath.lastIndexOf(".")).toLowerCase() src = window.URL.createObjectURL(this.files[0]); //轉成可以在本地預覽的格式
                // 檢查是否是圖片
                if (!fileFormat.match(/.jpg|.png|.jpeg/)) { alert('上傳錯誤,文件格式必須為：png/jpg/jpeg'); $('#uploadImage').after($('#uploadImage').val("")); } else { $('#cropedBigImg').attr('src', src);   //顯示圖片
 } }) })

HTML代碼：

<asp:FileUpload ID="uploadImage" runat="server" accept=".jpg,.png,.jpeg" />
        <asp:Button ID="btnUploding" runat="server" Text="上傳圖片" OnClick="btnUploding_Click" />
        <br />
        <asp:Image ID="cropedBigImg" runat="server" style="width:100px"/>

aspx.cs代碼：

protected void btnUploding_Click(object sender, EventArgs e) { /* 設置路徑，絕對路徑和相對路徑的拼接 文件夾的創建和是否存在的判斷 文件大小的判斷 判斷上傳后的文件夾里是否含有指定的圖片 */

            //獲取網站部署的目錄，絕對路徑
            string tmpRootDir = Server.MapPath(System.Web.HttpContext.Current.Request.ApplicationPath.ToString());//獲取程序根目錄 //我自定義的路徑名稱 //相對路徑下的位置
            string filePath = @"圖片上傳\"; //為防止文件名重名，同一時間多人傳同一文件，服務器出錯
　　　　　　　//ddhhmmss為日期小時分鍾毫秒格式，可自定義
            string dateTimeNow = DateTime.Now.ToString("ddhhmmss"); //圖片上傳的文件夾
            string folderPath = tmpRootDir + filePath; //判斷是否存在該文件夾 如果不存在
            if (Directory.Exists(folderPath) == false) { //創建文件夾
 Directory.CreateDirectory(folderPath); } //再次判斷是否存在
            if (Directory.Exists(folderPath)) { //存在/成功創建 文件夾
                folderPath = folderPath + @"\"; } //獲取圖片名稱
            string fileName = uploadImage.FileName; if (fileName == "") { ClientScript.RegisterStartupScript(GetType(), "", "<script>alert('請選擇圖片！！！')</script>"); return; } else {
　　　　　　　　　　//將圖片重命名為當前日期時間+原名防止重復，可以自定義 fileName = dateTimeNow + fileName; } //最后拼接出整體路徑
            string pathLast = folderPath + fileName; //限制上傳文件的大小，系統默認4M //1Mb=1024kb=(1024*1024)b
            if (uploadImage.PostedFile.ContentLength > ((1024 * 1024) * 10)) { ClientScript.RegisterStartupScript(GetType(), "", "<script>alert('文件大小超過10MB！！！')</script>"); //結束執行
                return; } //保存到指定路徑
 uploadImage.SaveAs(pathLast); //枚舉指定路徑里面，指定文件的數量，類型為long
            long ImgNum = Directory.GetFiles(folderPath, fileName, SearchOption.AllDirectories).LongLength; if (ImgNum >= 0) { ClientScript.RegisterStartupScript(GetType(), "", "<script>alert('上傳成功！！！')</script>"); } else { ClientScript.RegisterStartupScript(GetType(), "", "<script>alert('上傳失敗！！！')</script>"); return;//不存在
 } //#### 注意：在C#端限制所傳文件大小不好用。 //#### 原因：如果文件超過了系統最大長度，C#端是限制不住的，會直接將程序崩潰。 //#### 也可以在Web.confight里面設置所傳文件的大小 // 
            #region 這里是是Js限制上傳文件大小
            // < script > // document.getElementById("Button1").onclick = function() // { // var file = document.getElementById("FileUpload1"); // if (file.value.length <= 0)//如果選中選中文件沒有文件沒有長度，就是沒有選中文件 // { // alert("請選擇所傳文件"); // return false;//停止操作 // } // else // { // if (file.files[0].size > ((1024 * 1024) * 10))//<strong>選中文件的第一個文件的大小</strong>大於等於10M // { // alert("文件大小不能超過10Mb"); // return false;//停止操作 // } // } // } // </script > 
            #endregion }

記得引入命名空間：

using System.IO;

到這就完成了，在aspx頁面右鍵運行就可以看到效果，上傳后的圖片不會當即在VS的項目中顯示出來，但是在項目文件夾中可以看到，成功點個贊！