ASP.Net MVC - Img Src Server Path

Question

Visual Studio 2012 - ASP.net - MVC 4

I am having troubles displaying an image from a server path which is stored in a database.

I am using HttpPostedFileBase to retrieve the file the user has uploaded:

using (var uow = _db.CreateUnitOfWork())
            {
                if (imageUpload != null && imageUpload.ContentLength > 0)
                {
                    var fileName = Path.GetRandomFileName() + Path.GetExtension(imageUpload.FileName);
                    var path = Path.Combine(System.Web.Hosting.HostingEnvironment.MapPath("~/Uploads"), fileName);
                    imageUpload.SaveAs(path);
                    achievement.ImageLoc = path;
                }

                uow.Add(achievement);
                Save(uow);
                return true;
            }

This will save the absolute path of the uploaded file into the database and save the file onto the server. When I try to retrieve this path to display an image file in a view all I get is a blank square like the file is not being found (about:blank when right click -> copy image url). I know the path is correct because I am using it in a different view to allow users to download files, which is working correctly. Also I am allowing the user to edit the file which successfully deletes the old and uploads a new one. The only problem I am having is displaying an image in a view.

I have tried:

<img src="@Html.Encode(Model.ImageLoc)" />
<img [email protected](Model.ImageLoc)" />

Would anyone be able to suggest anything?

Have you checked the Html of the output? (i.e. View Source on the page it renders). A quick scan over the link it places in the src tag will probably give you a better idea of what's wrong. Things to check for include the path being double encoded (i.e. you encode it once on the way to the database, and again on the way out) or missing a "/" towards the end of the path. — Smudge202
– Smudge202, Commented Oct 9, 2012 at 16:02
<img src="\\PDC2\sites\t\<site.co.uk>\public_html\Uploads\tccxdfu0.nde.jpg" /> — Jpin
– Jpin, Commented Oct 9, 2012 at 16:27

Darin Dimitrov · Accepted Answer · 2012-10-09 16:30:10Z

13

You have stored the absolute path to the image in your database, but you need to reference it with the relative path:

<img src="@Url.Content("~/Uploads/" + System.IO.Path.GetFileName(Model.ImageLoc))" alt="" />

The resulting HTML must look like this:

<img src="/Uploads/tccxdfu0.nde.jpg" alt="" />

and not:

<img src="\\PDC2\sites\t\<site.co.uk>\public_html\Uploads\tccxdfu0.nde.jpg" alt="" />

because the client cannot access such folders from the server.

answered Oct 9, 2012 at 16:30

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

RubbleFord · Accepted Answer · 2012-10-09 16:21:10Z

0

Look at using

http://msdn.microsoft.com/en-us/library/system.web.mvc.mvchtmlstring%28VS.100%29.aspx I suspect it's being encoded hence not outputting as you expect.

answered Oct 9, 2012 at 16:21

RubbleFord

7,6669 gold badges55 silver badges80 bronze badges

Collectives™ on Stack Overflow

ASP.Net MVC - Img Src Server Path

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related