Как взять картинку из формы

Question

Столкнулся с проблемой что не могу взять картинку из формы. Каждый раз когда загружаю картинку то всегда получаю значения null. Создал отдельный метод через интерфейсы для того чтобы сохранять данные в БД(mongo db) и просто его каждый раз изменять. И мне кажется это наверное и за этого, так как обычно все россписовал в контроллере и так оно обычно работало, но тут решил попробовать подругому(так как изучаю интерфейсы). Может кто-то подсказать в чем проблема и что делаю не так. Если вкратце то, мне нужно взять картинку из формы и конвертировать в массив байтов и так сохранить в БД, чтобы потом можно было конвертировать обратно и вывести на экран

Это мой контроллер

[HttpPost]
    public async Task<IActionResult> Add([FromForm] ArticleViewModel artice,IFormFile file)
    {
        int result= await AddArticles(artice,file);

        if(result ==201 && ModelState.IsValid)
        {
            return RedirectToAction("Index","Home");

        }
        else
        {
            return View(artice);
        }

    }

    //метод из интерфейса

    public async Task<int> AddArticles(ArticleViewModel articles,IFormFile file)
    {
        if (articles != null && articles.Name != null && articles.Article != null && articles.category != null)
        {
            DateTime dateTime = new DateTime();
            articles.dateTimeOfCreate = dateTime.Date;
            var client = new MongoClient("mongodb://localhost:27017/?readPreference=primary&appname=MongoDB%20Compass%20Community&ssl=false");
            var database = client.GetDatabase("Article");
            var collection = database.GetCollection<ArticleViewModel>("article");

            if (articles.UrlImage!= null)
            {

                
                var ArticleModel = new ArticleModel();
                using (var memoryStream = new MemoryStream())
                {
                    file.CopyTo(memoryStream);
                    articles.UrlImage = memoryStream.ToArray();
                    
                   
                    //articles.imagecontext = memoryStream.ToArray();
                }



                await collection.InsertOneAsync(articles);

            }
            return 201;
        }
    

        else
        {
            return 400;
        }
    }

Класс с данными

public class ArticleViewModel
{

    [BsonId]
    public ObjectId _id { get; set; }
    
    [BsonElement("Name")]
    public string Name { get; set; }
    [BsonElement("Article")]
    public string Article { get; set; }
    [BsonElement("Image")]
    public byte[] UrlImage { get; set; }
    [BsonElement("dateTimeOfCreate")]
    public DateTime dateTimeOfCreate { get; set; }
    [BsonElement("Category")]
    public string category { get; set; }
    
}

Представления

@*
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@

    @model WebApplication5.ViewModel.ArticleViewModel

@{
    ViewData["Title"] = "Home Page";

<form id="form1" method="post"
      enctype="application/x-www-url-formencoded" asp-action="Add" asp-controller="AddArticle"> 

    <div>
        <label for="Name">Name</label>
    </div>
    <div>
        <input name="Name" type="text" />
    </div>
    <div>
        <label for="Article">Article</label>
    </div>
    <div>
        <input name="Article" type="text" />
    </div>
    <div>
        <label for="UrlImage">Image</label>
    </div>
    <div>
        <input name="UrlImage" id="image" type="file" />
    </div>
    <div>
        <label for="category">Category</label>
    </div>
    <div>
        <select class="mdb-select md-outline md-form form-control" name="category" id="category" >
            <option selected class="d-none" disabled value=""> Нажмите чтобы выбрать </option>
            
            <option value="first">first</option>
            
        </select>
    </div>

    <div>
        <input type="submit" value="Submit" />
    </div>
</form>

}

Answer 1

Раз у вас есть отдельные сущности ArticleViewModel и ArticleModel, то в ArticleViewModel вы можете изменить тип свойства UrlImage на IFormFile.

В этом случае, при условии что атрибут enctype у формы установлен в multipart/form-data и на форме есть инпут привязанный к свойству UlrImage, вы получите в этом свойстве объект IFormFile.

<form asp-action="Add" enctype="multipart/form-data">
    ...
    <div class="form-group">
        <label asp-for="UrlImage" class="control-label"></label>
        <input asp-for="UrlImage" class="form-control" type="file" />
        <span asp-validation-for="UrlImage" class="text-danger"></span>
    </div>
</form>

[HttpPost]
public async Task<IActionResult> Add([FromForm] ArticleViewModel artice) {
    int result = await AddArticles(artice, artice.UrlImage);

    if(result == 201 && ModelState.IsValid) {
        return RedirectToAction("Index", "Home");

    } else {
        return View(artice);
    }

}

БЛОГ НА HUSL

Как взять картинку из формы

Ответы (1 шт):