web-dev-qa-db-ja.com

ASP.NET Coreを使用してデータベースに画像を保存する方法は?

ASP.NET Core(MVC 6)EF Visual Studioを使用して小さなブログに取り組んでいます。画像をデータベースに保存する方法を見つけるのに苦労しています。私はIFormfileについて読んだことがありますが、その方法についてはよくわかりません。私はこれに慣れていないので、少し助けてほしいです。

作成中の投稿に画像を保存します(同じフォームで)。したがって、私はそれをpostIDに保存したいと思います。次に、画像を表示できるようにする必要がありますが、どうすればよいですか?私は多くの質問があることを知っていますが、どこを向くべきかわかりません。良いヒントやアイデアがあれば、リンクを送ってください。

前もって感謝します!

9
ErikLm

これは、データベースに保存する必要がある場合に便利です。これは https://www.mikesdotnetting.com/article/259/asp-net-mvc-5-with-ef-6-working-with-files の修正であり、 k7Boysの回答はこちら MVC 6 HttpPostedFileBase?

<input type="file" name="Image" id="Imageinput">

Blog Modal Classには、次のようなImgフィールドが必要です。

    public int BlogId{ get; set; }
    ...
    public byte[] Img{ get; set; }

コントローラ;

    public async Task<IActionResult> Create([Bind("BlogId,...Img")] Blog blog t, IFormFile Image)
    if (ModelState.IsValid)
        {
            if (Image!= null)

            {
                if (Image.Length > 0)

                //Convert Image to byte and save to database

                {

                    byte[] p1 = null;
                    using (var fs1 = Image.OpenReadStream())
                    using (var ms1 = new MemoryStream())
                    {
                        fs1.CopyTo(ms1);
                        p1 = ms1.ToArray();
                    }
                    Blog.Img= p1;

                }
            }

            _context.Add(client);
            await _context.SaveChangesAsync();

            return RedirectToAction("Index");
        }

ここに着くまでに数時間かかった。ビューでの画像の表示に取り組んでいますが、これは複雑ではないことは確かです。楽しい

9
sav

これでうまく動作します

コントローラ

[HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<IActionResult> Create([Bind("Id,PostMode,Message,Image,AccountId,Created,Status")] Post post, IFormFile Image)
        {
            if (ModelState.IsValid)
            {
                using (var ms = new MemoryStream())
                {
                    Image.CopyTo(ms);
                    post.Image = ms.ToArray();
                }

                    _context.Add(post);
                await _context.SaveChangesAsync();
                return RedirectToAction(nameof(Index));
            }
            return View(post);
        }

画像を表示

@foreach (var item in Model)
        {
    <img class="img-responsive full-width" src="data:image/jpeg;base64,@Convert.ToBase64String(item.Image)" />
}
3
Jagdish Kumar

IFormFileを使用して、ビューから投稿された画像を保存できます。以下はサンプルコードです。

public class UserProfileViewModel
    {
        public string UserName { get; set; }
        public IFormFile UploadedImage { get; set; }
        public string ImageUrl { get; set; }
    }

ビューでは、次のようにIFormFileプロパティにバインドします。

<img src="@Model.ImageUrl" alt="User Logo" asp-append-version="true" />
<input type="file" asp-for="UploadedImage" />

コントローラーでは、次のようにサーバーにファイルを保存するだけです。

var filename = ContentDispositionHeaderValue
                                    .Parse(user.UploadedImage.ContentDisposition)
                                    .FileName
                                    .Trim('"');
                    filename = Path.Combine(webRoot, "/Content/UserProfile/", $@"\{filename}");
                    if (Directory.Exists(webRoot + "/Content/UserProfile/"))
                    {
                        using (FileStream fs = System.IO.File.Create(filename))
                        {
                            user.UploadedImage.CopyTo(fs);
                            fs.Flush();
                        }
                    }
model.ImageURL = "~/Content/Brands/" + user.UploadedImage.FileName;
0
Nomi Ali