Error page in ASP MVC

Question

My 404.html contains:

<img class="img-responsive center-block" src="Images/error404.png"/>

My Web.config in the project folder contains:

<httpErrors errorMode="Custom" existingResponse="Replace">
     <remove statusCode="404"/>
     <error statusCode="404" path="404.html" responseMode="File"/>
</httpErrors>

I can access image through http://localhost:53870/Images/error404.png in browser.

Image in 404.html is loading when i call it directly

localhost:53870/404.html

Or when i call

http://localhost:53870/NonexistentController

Image in 404.html ISN'T loading when i call something like this

http://localhost:53870/Home/NonexistentAction

add a slash to the front of the `src`: `` – Liam Nov 21 '16 at 16:31 — Liam, Nov 21 '16 at 16:31

score 2 · Accepted Answer · answered Nov 21 '16 at 16:39

2

You are missing a backslash at the start of the image path.

Change:

<img class="img-responsive center-block" src="Images/error404.png"/>

To:

<img class="img-responsive center-block" src="/Images/error404.png"/>

answered Nov 21 '16 at 16:39

MadDev

1,130
1
13
29

score 1 · Answer 2 · answered Nov 21 '16 at 16:39

1

In razor files, you may take advantage of the ~ operator.~ will return the virtual root path.

<img class="img-responsive center-block" src="~/Images/error404.png"/>

With this, Your image src value will be correct irrespective of which sub folder/path you are in.

answered Nov 21 '16 at 16:39

Shyju

214,206
104
411
497

I've never understood the point of this. Flat out HTML does the exact same thing with a starting `/`. Why Microsoft added this as well I'll never know – Liam Nov 21 '16 at 16:59

Error page in ASP MVC

2 Answers2