سه شنبه , آبان ۲۹ ۱۳۹۷
خانه / آموزش برنامه نویسی / آموزش برنامه نویسی وب / آموزش Asp.net core / آموزش آپلود و ذخیره عکس در Asp.net core

آموزش آپلود و ذخیره عکس در Asp.net core

آموزش آپلود و ذخیره عکس در Asp.net core

در این مقاله از وب سایت Aspcore.ir قصد داریم در مورد آموزش آپلود و ذخیره عکس در Asp.net core صحبت کنیم. مطمئنا برای شما نیز در طول مراحل برنامه نویسی پیش آمده است که بخواهید تصاویری را درون سرور آپلود کنید و از آن استفاده کنید. در مقالات قبلی به صورت کامل و با ذکر مثال عملی در مورد آموزش نحوه آپلود فایل از طریق Ajax صحبت کرده ایم.

به طور معمول در اکثر سایتهایی که طراحی می شود خود عکس را در دیتابیس ذخیره نمی کنند و عرف این است که عکس را در قسمت روت سایت یا همان wwwroot ذخیره می کنند. البته باید گفت که پوشه wwwroot در پروژه های از نوع Asp.net core وجود دارد و نام عکس را در فیلدی در دیتابیس ذخیره می کنند که این فیلد را می توان از نوع varchar تعریف کرد. دلیل تعریف این فیلد از نوع varchar این می باشد که مسیر عکس یه رشته می باشد.

 

اما اجازه دهید تا به صورت عملی این کار را انجام دهیم.

آموزش نحوه آپلود و ذخیره عکس در Asp.net core

یک کنترلر با نام HomeController و یک View با نام index ایجاد کنید.

در View دستورات زیر را بنویسید :

<form method="post" asp-action="Index" asp-controller="Home" enctype="multipart/form-data">
    <input type="file" name="files" multiple/>
    <input type="submit" value="Upload" />
</form>

همانطوری که مشاهده می کنید یک تگ input با نوع file را ایجاد کردیم

در کنترلر نیز دستورات زیر را وارد نمایید:

public class HomeController : Controller
{
    private IHostingEnvironment _environment;

    public HomeController(IHostingEnvironment environment)
    {
        _environment = environment;
    }
    public IActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public async Task<IActionResult> Index(ICollection<IFormFile> files)
    {
        var uploads = Path.Combine(_environment.WebRootPath, "uploads");
        foreach (var file in files)
        {
            if (file.Length > 0)
            {
                using (var fileStream = new FileStream(Path.Combine(uploads, file.FileName), FileMode.Create))
                {
                    await file.CopyToAsync(fileStream);
                }
            }
        }
        return View();
    }
}

با استفاده از دستورات بالا عکس در روت سایت و در مسیری که ایجاد کرده ایم (uploads) ذخیره میشود.

اما اگر می خواهید همزمان نام عکس در دیتابیس ذخیره هم شود باید کدهای زیر را در متد Create بنویسید. از قبل باید یک ویو هم برای Create ایجاد کرده باشید:

[HttpPost] [ValidateAntiForgeryToken] public async Task<IActionResult> Create(Books books)
{
if (ModelState.IsValid)
{

var files = HttpContext.Request.Form.Files;

foreach (var Image in files)
{
if (Image != null && Image.Length > 0)
{

var file = Image;
var uploads = Path.Combine(_appEnvironment.WebRootPath, “uploads\\img\\books”);

if (file.Length > 0)
{
var fileName = ContentDispositionHeaderValue.Parse
(file.ContentDisposition).FileName.Trim(‘”‘);

System.Console.WriteLine(fileName);
using (var fileStream = new FileStream(Path.Combine(uploads, file.FileName), FileMode.Create))
{
await file.CopyToAsync(fileStream);
books.BookPic = file.FileName;
}

}
}
}

_context.Add(books);
await _context.SaveChangesAsync();
return RedirectToAction(“Index”);

}
else
{
var errors = ModelState.Values.SelectMany(v => v.Errors);
}
return View(books);
}

درباره سعید بحرانی فرد

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *