uploading image asp.net Core
You should inject IHostingEnvironment
so you can get the web root (wwwroot
by default) location.
public class HomeController : Controller
{
private readonly IHostingEnvironment hostingEnvironment;
public HomeController(IHostingEnvironment environment)
{
hostingEnvironment = environment;
}
[HttpPost]
public async Task<IActionResult> UploadFiles(List<IFormFile> files)
{
long size = files.Sum(f => f.Length);
// full path to file in temp location
var filePath = Path.GetTempFileName();
foreach (var formFile in files)
{
var uploads = Path.Combine(hostingEnvironment.WebRootPath, "images");
var fullPath = Path.Combine(uploads, GetUniqueFileName(formFile.FileName));
formFile.CopyTo(new FileStream(fullPath, FileMode.Create));
}
return Ok(new { count = files.Count, size, filePath });
}
private string GetUniqueFileName(string fileName)
{
fileName = Path.GetFileName(fileName);
return Path.GetFileNameWithoutExtension(fileName)
+ "_"
+ Guid.NewGuid().ToString().Substring(0, 4)
+ Path.GetExtension(fileName);
}
}
This will save the files to the images
directory in wwwroot
.
Make sure that your form tag's action
attribute is set to the UploadFiles
action method of HomeController(/Home/UploadFiles
)
<form method="post" enctype="multipart/form-data" asp-controller="Home"
asp-action="UploadFiles">
<div class="form-group">
<div class="col-md-10">
<p>Upload one or more files using this form:</p>
<input type="file" name="files" multiple />
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<input type="submit" value="Upload" />
</div>
</div>
</form>
I am not very certain why you want to return Ok result from this. You may probably return a redirect result to the listing page.
File upload in ASP.NET Core MVC in simple steps
1.Demo.cshtml View Code snippet
<form method="post" enctype="multipart/form-data" asp-controller="Demo" asp-action="Index">
<div class="form-group">
<div class="col-md-10">
<p>Upload one or more files using this form:</p>
<input type="file" name="files" multiple />
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<input type="submit" value="Upload" />
</div>
</div>
- DemoController
For showing demo i have created a Demo Controller which has 2 Action Methods in it one to handle Get Request and another to handle post request.
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Mvc;
using System;
using System.IO;
using System.Net.Http.Headers;
namespace WebApplication6.Controllers
{
public class DemoController : Controller
{
private readonly IHostingEnvironment _environment;
// Constructor
public DemoController(IHostingEnvironment IHostingEnvironment)
{
_environment = IHostingEnvironment;
}
[HttpGet]
public IActionResult Index()
{
return View();
}
[HttpPost]
public IActionResult Index(string name)
{
var newFileName = string.Empty;
if (HttpContext.Request.Form.Files != null)
{
var fileName = string.Empty;
string PathDB = string.Empty;
var files = HttpContext.Request.Form.Files;
foreach (var file in files)
{
if (file.Length > 0)
{
//Getting FileName
fileName = ContentDispositionHeaderValue.Parse(file.ContentDisposition).FileName.Trim('"');
//Assigning Unique Filename (Guid)
var myUniqueFileName = Convert.ToString(Guid.NewGuid());
//Getting file Extension
var FileExtension = Path.GetExtension(fileName);
// concating FileName + FileExtension
newFileName = myUniqueFileName + FileExtension;
// Combines two strings into a path.
fileName = Path.Combine(_environment.WebRootPath, "demoImages") + $@"\{newFileName}";
// if you want to store path of folder in database
PathDB = "demoImages/" + newFileName;
using (FileStream fs = System.IO.File.Create(fileName))
{
file.CopyTo(fs);
fs.Flush();
}
}
}
}
return View();
}
}
}
Snapshot while Debugging
Location of folder where Images are stored