Search code examples
blazor-server-side.net-6.0

When the application is deployed, the image does not appear


I use this code to show image

<button type="submit" class="buttonstyle"><img src="/images/Logout.png" alt="Logout"></button>

Working fine on development machine .
But when I deployed to the server (Windows Server 2019) the folder is on partition C
I got this error

Failed to load resource: the server responded with a status of 404 (Not Found)

I try with this

src="../wwwroot/images/Logout.png"

And I try to use a full path

<button type="submit" class="buttonstyle"><img src="@logoutImage" alt="Logout"></button>
@code{
    string? logoutImage = $@"{Directory.GetCurrentDirectory()}{@"\wwwroot\images\Logout.png"}";
}

I got this error

Not allowed to load local resource: file:///C:/SmartHR/wwwroot/images/Logout.png

Update
enter image description here
Any Help .


Solution

  • After reading this article
    Host and deploy ASP.NET Core Blazor
    I found this
    Do not prefix links throughout the app with a forward slash. Either avoid the use of a path segment separator or use dot-slash (./) relative path notation:

    ❌ Incorrect: <a href="/account">
    ✔️ Correct: <a href="account">
    ✔️ Correct: <a href="./account">

    After removing the forward slash from <img src="images/Logout.png">
    Everything works fine.