CODEWITHSUNDEEP
asp.net-core-mvc.net-6.0
b.g
b.g

Reputation: 41

Images don't appear in ASP.NET Core 6 MVC

I'm trying to view images in an ASP.NET Core 6 MVC application but it doesn't work.

This is my controller function to add an item with image

public IActionResult Add(ProductEditViewModel model, string? returnUrl = null)
{
    string? UploadUrl = "/wwwroot/Uploads/Product/";

    string newFileName = Guid.NewGuid().ToString() + model.Image.FileName;
    model.ImageUrl = UploadUrl + newFileName;

    FileStream fs = new FileStream(Path.Combine
            (
                Directory.GetCurrentDirectory(),
                "wwwroot",
               "Uploads", "Product", newFileName
            ), FileMode.Create);

    model.Image.CopyTo(fs);
    fs.Position = 0;

    ProductRepo.Add(model);
    UnitOfWork.Save();

    return RedirectToAction("Get");
}

I want to view it in a table, here is my <td> in the view:

<td> 
    <img src="@V.ImageUrl" style="width:100px; height:100px;">   
</td>

@V is a ProductViewModel type.

What is the problem? I don't even know where to trace.

Upvotes: 1

Views: 1507

Answers (1)

Xinran Shen
Xinran Shen

Reputation: 9963

When you want to show image saved in wwwroot folder, You can't write url like wwwroot/.../..., browser will not find this path. You just need to write the project structure as url without wwwroot.

For example, My project structure is as follows：

wwwroot
 -css
 -js
 -lib
 -image
  --Test.jpg

If I wanna show Test.jpg in the page, The correct Url is <img src="/image/Test.jpg" /> instead of <img src="/wwwroot/image/Test.jpg" />.

Note: When you want to Serve files outside of web root, You also need to configure the Static File Middleware.

Upvotes: 2

Related Questions