Blazor server app cannot access the static content of the subproject

Question

I've created

a Blazor Server app ( BlazorServerApp )(.Net Core 3.1)
a .NET Standard Class Library ( MyClassLibrary )

I've added the MyClassLibrary project to the dependencies of the BlazorServerApp . Then I've added wwwroot folder to the MyClassLibrary project and added test.js file to this folder.

I've edited the MyClassLibrary project file as follows:

<Project Sdk="Microsoft.NET.Sdk">    
  <PropertyGroup>
    <TargetFramework>netstandard2.0</TargetFramework>
    <AssemblyName>MyClassLibrary</AssemblyName>
    <RootNamespace>MyClassLibrary</RootNamespace>
  </PropertyGroup>

  <ItemGroup>
    <EmbeddedResource Include="wwwroot\**\*.js" LogicalName="blazor:js:%(RecursiveDir)%(Filename)%(Extension)" />
  </ItemGroup>    
</Project>

Blazor web app call the UseStaticFiles method in Startup, which enables static files to be served:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    else
    {
        app.UseExceptionHandler("/Error");
        app.UseHsts();
    }

    app.UseHttpsRedirection();
    app.UseStaticFiles();

    app.UseRouting();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapBlazorHub();
        endpoints.MapFallbackToPage("/_Host");
    });
}

I've added the test.js as <script src="_content/MyClassLibrary/test.js"></script> in the _Host.cshtml (BlazorServerApp project):

@page "/"
@namespace BlazorServerApp.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>BlazorServerApp</title>
    <base href="~/" />
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
    <link href="css/site.css" rel="stylesheet" />
</head>
<body>
    <app>
        <component type="typeof(App)" render-mode="ServerPrerendered" />
    </app>

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>

    <script src="_framework/blazor.server.js"></script>
    <script src="_content/MyClassLibrary/test.js"></script>
</body>
</html>

However, when I run the BlazorServerApp project the error appears in the browser:

GET https://localhost:5001/_content/MyClassLibrary/test.js net::ERR_ABORTED 404

That is, the web app doesn't find such a resource at the specified path.

Can anyone explain why this is happening and what needs to be done in order for the application to access static resources (such as js or css) in other dependent projects (net standard class library in my case)?

Answer 1

Open the component project properties and go to package tab.

You must set a value in Package id

Then you use this id to specify the path

<script src="_content/package_id/test.js"></script>

Blazor server app cannot access the static content of the subproject

Question

1 answers

solution1
1 2020-09-03 14:53:32

Blazor server app cannot access the static content of the subproject

Question

1 answers

solution1 1 2020-09-03 14:53:32

solution1
1 2020-09-03 14:53:32