Comment télécharger des fichiers dans le asp.net core?

Vous pouvez ajouter une nouvelle propriété de type IFormFile pour votre modèle de vue

public class CreatePost
{
   public string ImageCaption { set;get; }
   public string ImageDescription { set;get; }
   public IFormFile MyImage { set; get; }
}

et OBTENIR votre méthode d'action, nous allons créer un objet de ce modèle de vue et de les envoyer à la vue.

public IActionResult Create()
{
   return View(new CreatePost());
}

Maintenant dans votre Créer une vue fortement typée pour notre modèle de vue, ont un form balise qui a le enctype attribut "multipart/form-data"

@model CreatePost
<form asp-action="Create" enctype="multipart/form-data">   

    <input asp-for="ImageCaption"/>
    <input asp-for="ImageDescription"/>
    <input asp-for="MyImage"/>

    <input type="submit"/>
</form>

Et votre HttpPost d'action pour gérer la publication de formulaires

[HttpPost]
public IActionResult Create(CreatePost model)
{
   var img = model.MyImage;
   var imgCaption = model.ImageCaption;

   //Getting file meta data
   var fileName = Path.GetFileName(model.MyImage.FileName);
   var contentType = model.MyImage.ContentType;

   //do something with the above data
   //to do : return something
}

Si vous voulez télécharger le fichier dans un répertoire de votre application, vous devez utiliser IHostingEnvironment pour obtenir la racine de votre site chemin. Voici un échantillon de travail.

public class HomeController : Controller
{
    private readonly IHostingEnvironment hostingEnvironment;
    public HomeController(IHostingEnvironment environment)
    {
        hostingEnvironment = environment;
    }
    [HttpPost]
    public IActionResult Create(CreatePost model)
    {
        //do other validations on your model as needed
        if (model.MyImage != null)
        {
            var uniqueFileName = GetUniqueFileName(model.MyImage.FileName);
            var uploads = Path.Combine(hostingEnvironment.WebRootPath, "uploads");
            var filePath = Path.Combine(uploads,uniqueFileName);
            model.MyImage.CopyTo(new FileStream(filePath, FileMode.Create)); 

            //to do : Save uniqueFileName  to your db table   
        }
        //to do  : Return something
        return RedirectToAction("Index","Home");
    }
    private string GetUniqueFileName(string fileName)
    {
        fileName = Path.GetFileName(fileName);
        return  Path.GetFileNameWithoutExtension(fileName)
                  + "_" 
                  + Guid.NewGuid().ToString().Substring(0, 4) 
                  + Path.GetExtension(fileName);
    }
}

Cela permettra d'enregistrer le fichier à uploads dossier à l'intérieur wwwwroot répertoire de votre application avec un nom de fichier aléatoire généré à l'aide de Guid ( pour éviter d'écraser des fichiers avec le même nom)

Nous voici à l'aide d'une très simple GetUniqueName méthode permettant d'ajouter 4 caractères à partir d'un guid à la fin du nom de fichier pour le rendre un peu unique. Vous pouvez mettre à jour la méthode pour le rendre plus sophistiqué que nécessaire.

Devriez-vous être de stocker l'url complète de l'image téléchargée dans la base de données ?

Pas. Ne pas stocker l'url complète de l'image dans la base de données. Que faire si demain votre entreprise décide de changer votre société nom du produit de www.thefacebook.com à www.facebook.com ? Maintenant, vous devez corriger toutes les url de la table!

Que devriez-vous stocker ?

Vous devez conserver le nom de fichier unique qui vous avez généré ci-dessus(la uniqueFileName varibale nous avons utilisé ci-dessus) pour stocker le nom du fichier. Lorsque vous souhaitez afficher l'image en arrière, vous pouvez utiliser cette valeur (le nom de fichier) et de construire l'url de l'image.

Par exemple, vous pouvez le faire dans votre vue.

@{
    var imgFileName = "cats_46df.png";
}
<img src="~/uploads/@imgFileName"  alt="my img"/>

Je viens de codé en dur un nom d'image à imgFileName variable et utilisé. Mais vous pouvez lire le fichier enregistré le nom de votre base de données et mis à votre modèle de vue de la propriété et de l'utilisation que. Quelque chose comme

<img src="~/uploads/@Model.FileName"  alt="my img"/>

Stockage de l'image à la table

Si vous souhaitez enregistrer le fichier en tant que bytearray/varbinary à votre base de données, vous pouvez convertir le IFormFile objet de tableau d'octets comme ce

private byte[] GetByteArrayFromImage(IFormFile file)
{
    using (var target = new MemoryStream())
    {
        file.CopyTo(target);
        return target.ToArray();
    }
}

Maintenant dans votre post http méthode d'action, vous pouvez appeler cette méthode pour générer le tableau d'octets à partir IFormFile et l'utiliser pour enregistrer à votre table. l'exemple ci-dessous est en essayant de sauver une entité Post objet à l'aide de entity framework.

[HttpPost]
public IActionResult Create(CreatePost model)
{
    //Create an object of your entity class and map property values
    var post=new Post() { ImageCaption = model.ImageCaption };

    if (model.MyImage != null)
    {
       post.Image =  GetByteArrayFromImage(model.MyImage);
    }
    _context.Posts.Add(post);
    _context.SaveChanges();
    return RedirectToAction("Index","Home");
}