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

Question

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

11.6k Views Asked by Michael Efraimidis At 20 October 2024 at 00:51

I'm having a very difficult time trying to understand what the issue is with my blazor application. I have a client blazor which I'm updating from .net 3.1 to .net 6. I've read the instructions regarding migrating from 3.1 to 6 however my application never loads when I'm trying to debug it. It throws:

"Failed to load resource: the server responded with a status of 404 ()" error

I've read in other posts about blazor.webassembly.js not loading properly but I'm not sure what I'm doing wrong. I've checked the references for any errors. The Api reference is running properly on .NET 6 and the Shared library is using .net standard 2.0 Here is some code in case you need it.

Thanks for your time.

Index.html:

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net6.0</TargetFramework>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.5" />
    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.5" PrivateAssets="all" />
    <PackageReference Include="Microsoft.Extensions.Http" Version="6.0.0" />
    <PackageReference Include="System.Net.Http.Json" Version="6.0.0" />
  </ItemGroup>

  <ItemGroup>
    <ProjectReference Include="..\SkillMatrix.Api\SkillMatrix.Api.csproj" />
    <ProjectReference Include="..\SkillMatrix.Shared\SkillMatrix.Shared.csproj" />
  </ItemGroup>

</Project>

Index.html:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>SkillMatrix.Client</title>
    <base href="/" />
    <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
    <link href="css/app.css" rel="stylesheet" />
</head>

<body>
    <app>Loading...</app>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss"></a>
    </div>
    <script src="_framework/blazor.webassembly.js"></script>
</body>

</html>

Original Q&A

There are 3 best solutions below

**Michael Efraimidis** · Answer 1

Figured out the solution. I had to change the csproj from

<Project Sdk="Microsoft.NET.Sdk.Web">

to

<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">

based on this answer

Also make sure that the Microsoft.AspNetCore.Components.WebAssembly references on the item group are set to at least version 6.0.0

**BDisp** · Answer 2

Only replacing <link href="BlazorServer.styles.css" rel="stylesheet" /> to <link href="AppName.styles.css" rel="stylesheet" /> fixed the issue.

Edit:

Sorry, I made some confusing about BlazorServer because I though it was related to the Blazor Server template, but it was related to the name of Blazor project I have with that name. I was migrating another Blazor project from netcore3.1 to net6.0 and I faced the issue in this post and replacing what I writes above, it fixed the issue. So, anyone who have this problem, need always do <link href="AppName.styles.css" rel="stylesheet" />.

**Amir Hossein** · Answer 3

copy This or Replace to wwwroot index.html to head tag

<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="css/app.css" rel="stylesheet" />
<link rel="icon" type="image/png" href="favicon.png" />
<link href="BlazorApp1.Client.styles.css" rel="stylesheet" />



<link href="_content/Syncfusion.Blazor/styles/bootstrap5.css" rel="stylesheet" />
<script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>

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

There are 3 best solutions below

Related Questions in WEB

Related Questions in BLAZOR

Related Questions in CLIENT

Related Questions in .NET-6.0

Related Questions in .NET-3.0

Trending Questions

Popular # Hahtags

Popular Questions