.net實現上傳圖片到共享目錄(遠程服務器)


先大概理清一下思路:

1.共享目錄的配置,這里包括了新建一個共享目錄,而且必須設置一下目錄的權限。不然無法訪問操作此目錄。

2.iis站點下創建虛擬目錄指向共享目錄。

3.前端處理上傳圖片。

4.后台操作圖片保存到站點的虛擬目錄,並返回一個當前圖片路徑給前端展示。

實現:

1.創建共享文件夾並設置相關權限

 

權限這里,為了方便就直接給了every one

 

 

 2.iis站點下創建虛擬目錄指向共享目錄。

別名:是后台代碼上傳圖片是保存的路徑

物理路徑就是你創建的共享目錄的路徑,我是用了遠程服務器上的共享目錄,所以當我創建時會提示輸入賬號跟密碼。

 

 到這里前期准備工作就完成了,接下來就是敲代碼了。

3.前端處理上傳圖片

<input type="file" name="file"  multiple="multiple" id="imageSave" onchange="Javascript:validate_img(this);">

上傳圖片的input,這里我給了一個事件validate_img(this);用於檢驗圖片格式,大小,然后上傳

function validate_img(a) {
    var filetypes = [".jpg", ".png", ".jpeg", ".gif", ".JPG", ".PNG", ".JPEG", ".GIF"];//圖片格式
    var filepath = a.files[0].name;//圖片名稱
    if (filepath) {
        var isnext = false;
        var fileend = filepath.substring(filepath.lastIndexOf("."));
        if (filetypes && filetypes.length > 0) {
            for (var j = 0; j < filetypes.length; j++) {
                if (filetypes[j] == fileend) {
                    isnext = true;
                    break;
                }
            }
        }
        if (!isnext) {
            alert("不接受此文件類型!")
            a.value = "";
            return false;
        } else if (a.files[0].size > 1024 * 1024 * 2) {
            alert("單張圖片不能大於2m")
            a.value = "";
            return false;
        } else {
            //上傳
            var formdata = new FormData();
            var img_file3 = document.getElementById("imageSave");
            var fileobj3 = img_file3.files[0];//獲取圖片
            formdata.append('image', fileobj3);
            $.ajax({
                url: "/SaveImage?module=uploadimg",
                type: 'POST',
                data: formdata,
                cache: false,
                async: false,
                processData: false, // 告訴jQuery不要去處理發送的數據
                contentType: false, // 告訴jQuery不要去設置Content-Type請求頭
                success: function (result) {
                    if (result.IsSuccess == true) {
                       //上傳成功后,獲取圖片的路徑,用於前端展示
                    } else {
                        alert("上傳圖片異常:" + result.Date);
                    }
                }
            });
        }
    } else {
        return false;
    }
}

前端上傳部分就完成了,下面是后台處理過程:

4.后台操作圖片保存到站點的虛擬目錄,並返回一個當前圖片路徑給前端展示

//獲取上傳的文件
HttpPostedFileBase PostFile = Request.Files["image"];

然后判斷圖片是否存在

if (strExts.Contains(strExt))                 
{
    //獲取文件名
    string strfileName = PostFile.FileName.Trim();
    strfileName = repalceStr(strfileName);
    //獲取擴展名
    string strExt = Path.GetExtension(strfileName);
     //上傳目錄
     string mypath = System.Web.HttpContext.Current.Server.MapPath("~/upload_img/");
     DirectoryInfo theFolder = new DirectoryInfo(mypath);
     //定義新的文件名,格式:“201909110323146909_文件名.zip”
     string strNewName = DateTime.Now.ToString("yyyyMMddhhmmssffff") + "_" + strfileName;
      string path = Path.Combine(theFolder.FullName, strNewName);
      //保存文件到文件服務器
      PostFile.SaveAs(path);
      //將文件的保存的相對路徑輸出到客戶端
      var imgurl = "~/upload_img/" + strNewName;
      result.Data = imgurl;
}else{

}

到這里,就基本完成了。查看共享目錄是否有圖片!!

然后就是前端獲取返回的圖片路徑進行展示就好了。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM