十年網站開發(fā)經驗 + 多家企業(yè)客戶 + 靠譜的建站團隊
量身定制 + 運營維護+專業(yè)推廣+無憂售后,網站問題一站解決
這篇文章給大家分享的是有關.net core版上傳文件/ 批量上傳拖拽及預覽功能的實現(xiàn)方法的內容。小編覺得挺實用的,因此分享給大家做個參考。一起跟隨小編過來看看吧。

1.導入所需要的包:nuget install bootstrap-fileinput
注意:這里的導包需要在終端導入【需要在wwwroot文件夾下執(zhí)行nuget命令】如下圖

如果發(fā)現(xiàn)沒有nuget命令,則需要通過apt-get 或者yum 給系統(tǒng)安裝nuge包管理工具,這個nuget和vscode中的插件不是一回事
2前臺頁面編寫:
index.cshtml:
@{
ViewData["Title"] = "Home Page";
Layout = null;
}
基本上和asp.net mvc下邊沒有區(qū)別,只有一個地方需要特別注意一下,外部的script和css文件的引用文件需要放到wwwroot文件中,而不是項目的根目錄下。
預覽圖:

3.主要的區(qū)別 ,后臺
代碼如下:
public JsonResult UploadFile()
{
uploadResult result = new uploadResult();
try
{
var oFile = Request.Form.Files["txt_file"];
Stream sm=oFile.OpenReadStream();
result.fileName = oFile.FileName;
if(!Directory.Exists(AppContext.BaseDirectory+"/Image/"))
{
Directory.CreateDirectory(AppContext.BaseDirectory+"/Image/");
}
string filename=AppContext.BaseDirectory+"/Image/" + DateTime.Now.ToString("yyyymmddhhMMssss")+Guid.NewGuid().ToString() + ".png";
FileStream fs=new FileStream(filename,FileMode.Create);
byte[] buffer =new byte[sm.Length];
sm.Read(buffer,0,buffer.Length);
fs.Write(buffer,0,buffer.Length);
fs.Dispose();
}
catch(Exception ex)
{
result.error = ex.Message;
}
return Json(result);
}
public class uploadResult
{
public string fileName { get; set; }
public string error { get; set; }
}在netcore中無法再通過Request.Files對象來獲取從前臺傳遞的文件,這里需要使用Request.Form.Files來獲取來自客戶端提交的文件,接下來需要一個uploadResult結構體,給前臺返回json對象 這個結構中必須包含error字段,用來給前臺返回錯誤數(shù)據(jù),詳情查看官方文檔-官網地址
附一張最終的上傳成功保存到本地的圖片:

感謝各位的閱讀!關于.net core版上傳文件/ 批量上傳拖拽及預覽功能的實現(xiàn)方法就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。