404 on _content/Syncfusion.Blazor/styles/bootstrap4.css

Following the instructions in https://blazor.syncfusion.com/documentation/getting-started/server-side-blazor-dotnet-cli/ I set
  rel='nofollow' href="_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />


in _Host.cshtml and

public void ConfigureServices(IServiceCollection services)
{
services.AddSyncfusionBlazor();
services.AddRazorPages();
services.AddServerSideBlazor();
services.AddSingleton<WeatherForecastService>();
}

but when I run the appliction I get a 404 error on
https://localhost:5001/_content/Syncfusion.Blazor/styles/bootstrap4.css

Is this a problem with the documentation? Should it be done differently?



15 Replies 1 reply marked as answer

JA Jesus Arockia Sankaran S Syncfusion Team July 16, 2020 09:09 AM UTC

Hi Javier, 

Sorry for the inconvenience and thank you for contacting Syncfusion support. 

We have created a Blazor Server application using dotnet CLI and we are not able to reproduce the reported issue in our end. You can find the application and video from the below link for your reference.  



We request you to check the above sample in your machine and revert us whether you can reproduce the same in this sample. “_content” is the staticwebassets of the Syncfusion Blazor package reference as per the Blazor standards that you can refer from the below link. 


 

 

Also, we ask you to share more details of your problem such as code snippets, sample application, any application specific settings for clear understanding of your problem if we misunderstood your point. 

Please get back to us with requested details and further query if any. 

Regards, 
Jesus Arockia Sankaran S 




JS Javier Solorzano July 16, 2020 01:51 PM UTC

Thanks for the help!

The problem is

app.UseHttpsRedirection();

If I remove it, then I get the 404, but if I return it, it works. This is fine for learning and development but I wonder then what to do if I decide run an app behind an nginx reverse proxy that does LTS termination.



JA Jesus Arockia Sankaran S Syncfusion Team July 21, 2020 05:36 AM UTC

Hi Javier, 

Thank you for the details.  

While publishing all static resources are shipped to “wwwroot” folder from the installed location so we suspect that there will not be any problem while hosting the Blazor application.  We can also manually load the script and style by copying the static resources from installed location or referring the CDN links.  



Reference Image
 

Please get back to us if you need any further assistance on this.  

Regards, 
Jesus Arockia Sankaran S 



JS Javier Solorzano July 22, 2020 03:18 PM UTC

Hi again.

I see that if I run the project with ASPNETCORE_ENVIRONMENT=Development then the project runs fine. However, if the variable is missing or is any other value except Development then the app fails to load any syncfusion resource with a 404.

Is this something you're aware of?


EK Edward Kagan July 23, 2020 12:21 AM UTC

I have the same exact problem, all of a sudden when publishing to production I get missing resources because the environment is not set to Development.  


JA Jesus Arockia Sankaran S Syncfusion Team July 23, 2020 09:02 AM UTC

Hi Javier, 

Sorry for the inconvenience. 

We have checked the reported issue and it could be reproduced. We would let you know that other than “Development” environment we need to provide the correct path of the static resources in the configuration section of “startup.cs” or need to copy these static resources from installed location to “wwwroot” folder. You can find the sample application and the code snippet as below.  


Code Snippet
Startup.cs 

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)  
        {  
            if (env.IsEnvironment("Local") || env.IsEnvironment("Production") || env.IsEnvironment("Staging"))  
            {  
                app.UseStaticFiles(new StaticFileOptions  
                {  
                    FileProvider = new PhysicalFileProvider(  
                    @"C:\Users\${user-name}\.nuget\packages\syncfusion.blazor\18.1.0.54\staticwebassets"),  
                    RequestPath = "/_content/Syncfusion.Blazor"  
                });  
            }  
. . . .   
(more code follow)  
}  


Please get back to us if you need any further assistance on this. 

Regards, 
Jesus Arockia Sankaran S 



JA Jesus Arockia Sankaran S Syncfusion Team July 23, 2020 09:04 AM UTC

Hi Edward, 

Sorry for the inconvenience. 

We request you to refer the previous update and get back to us if you need any further assistance. 

Regards, 
Jesus Arockia Sankaran S 



RI richardv March 11, 2021 09:13 AM UTC

Maybe this will help someone like me;

I followed https://blazor.syncfusion.com/documentation/dialog/getting-started/ but added nuget Syncfusion.Blazor in stead of a specific package.

There it is said you need to add:



<link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/bootstrap4.css" rel="stylesheet" />

But in stead, after messing about looking into all kinds of things I came across StaticWebAssets.xml and determined this was required:

<link rel='nofollow' href="_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />


Maybe it is worth pointing this out explicitly on the getting started pages?


RK Revanth Krishnan Syncfusion Team March 11, 2021 12:43 PM UTC

Hi Richard, 
 
 
Greetings from Syncfusion support. 
 
 
We have validated your query “I followed https://blazor.syncfusion.com/documentation/dialog/getting-started/ but added NuGet ‘Syncfusion.Blazor’ instead of a specific package. But the style  reference showed error and after I found (<link rel='nofollow' rel='nofollow' href = "_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />) this link was required.  Maybe it is worth pointing this out explicitly on the getting started pages”. 
 
We have already documented this in the common Getting started page regarding the style reference for both common NuGet and individual NuGet. Please check the below document for reference, 
 
 
Also, we highly recommend using the individual NuGet packages for your Blazor production applications. Please refer to the below documentation to know the benefits of the individual NuGet packages. 
 
 
Please check the above documentation links and let us know if you need  any further assistance, 
 
Regards, 
Revanth 



PS Peter Shaw June 8, 2021 11:27 AM UTC

Sorry guys,

But I've just been hit by this same bug, and it's clearly a bug judging by what I've read so far.

I've looked at the suggestion to add the files direct from the users .nuget cache directory, and that is just the stupidest idea ever.

The projects I'm working on are sent to a separate CI build server that uses Jenkins to build the project, then from there it's deployed to a Linux server that has NO concept of windows folders and users.

This is clearly a case of the SF Blazor assembly NOT unpacking it's resources correctly into a standard ASP.Net core blazor server side application, so can we please have some sensible advice?

If the solution is to always use the CDN version, then lets use CDN, if not then please find the root cause of the issue.

This has to work for most of us in an autonomous fashion, in this day and age of automated builds and deployments, it's simply not good enough to expect devs to manually hack and patch applications at all stages of development.

For ME, for now.... I'm going to grab the resources directly out of the NuGet package and put them in a folder in my www root directory manually, then check those files into the git SVN server, I shouldn't have to do this, but at least it's a constant and unchanging way of doing it which means I don't need to start patching things at the other end.


MK Muthukumar Kannan Syncfusion Team June 10, 2021 05:09 PM UTC

Hi Peter, 

Sorry for the delay. 

According to your shared information, you have deployed the blazor application in the server machine. Based on that, we would like to suggest the solution for fetching the scripts from server machine by below startup content instead of using fetch from local machine nuget cache. Could you please check this with your scenario whether this issue resolved or not? 

 Startup.cs: 



app.UseStaticFiles(new StaticFileOptions  
                {  
                    FileProvider = new PhysicalFileProvider(  
                      Path.Combine(env.ContentRootPath, "wwwroot/_content/Syncfusion.Blazor/scripts")),  
                    RequestPath = "/_content/Syncfusion.Blazor"  
                }); 


_Host.cshtml:  


<head>  
    <meta charset="utf-8" />  
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />  
    <title>BlazorApp318837</title>  
    <base rel='nofollow' href="~/" />  
    <link rel="stylesheet" rel='nofollow' href="css/bootstrap/bootstrap.min.css" />  
    <link rel='nofollow' href="css/site.css" rel="stylesheet" />  
    <link rel='nofollow' href="_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />  
    <link rel='nofollow' href="BlazorApp318837.styles.css" rel="stylesheet" />  
</head> 


However, we suspect that you may set true to the AddSyncfusionBlazorService configuration in your ‘Startup.cs’. Our JS Interop scripts are loaded dynamically from static web assets through JS Isolation feature of Blazor. So, we recommend you remove the ‘true’ parameter from the ‘services.AddSyncfusionBlazor(true);’ in ‘Startup.cs’ then check it once again. 
 
If you still facing the issue please share the below details. 
 
  1. Did you modified or added the base path in the ‘_Host.cshtml’ file? 
  2. Did you modify any changes in ‘Environment variables in the ‘Properties/launchSettings.json’ file? If so, please share the details. 
  3. Could you please share the error details like image or video format?
 
The above details will helps to find the actual exact issue and provide the better support from our end. 

Please get back to us if you have any queries. 

Regards, 
Muthukumar K 


Marked as answer

DE desmond November 24, 2021 01:40 AM UTC

I took the sample code in the first reply of this thread. Everything works right in development mode, but when I changed it to production mode, the calendar looks strange. I hope my problem can be replicated in your computer.


Besides, the above methods are calling local nuget packages, so when I move my project from my computer to another computer without nuget, is there anything to solve the problem?


Attachment: WebApplication1_4c4f12bd.rar



JL Joshna Lingala Uthama Reddy Lingala Syncfusion Team November 24, 2021 02:10 PM UTC

Hi Desmond, 
 
Greetings from Syncfusion. 
 
Query 1: I took the sample code in the first reply of this thread. Everything works right in development mode, but when I changed it to production mode, the calendar looks strange. I hope my problem can be replicated in your computer. 
We have checked the reported issue for “controls not rendered properly in the production mode” at our end. With the shared file we could able to replicate the issue at our end. We would like to suggest you the below code to add in the application to render controls properly in the application even in the production mode  
 
Startup.cs: 
 
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)   
{   
    if (env.IsEnvironment("Local") || env.IsEnvironment("Production") || env.IsEnvironment("Staging"))   
    {   
        app.UseStaticFiles(new StaticFileOptions   
        {   
            FileProvider = new PhysicalFileProvider(   
             @"C:\Users\${user-name}\.nuget\packages\syncfusion.blazor\{Version}\staticwebassets"),   
             RequestPath = "/_content/Syncfusion.Blazor"   
         });   
     }   
. . . .    
(more code follow)   
}   
 
 

Query 2: Besides, the above methods are calling local nuget packages, so when I move my project from my computer to another computer without nuget, is there anything to solve the problem? 
 
We let you know that if you want to get scripts from the server machine instead of the Local nuget machine, you can get scripts by using the below code snippets in Development mode 
 
 
if (env.IsEnvironment("Local") || env.IsEnvironment("Production") || env.IsEnvironment("Staging")) 
{ 
      app.UseStaticFiles(new StaticFileOptions 
      { 
          FileProvider = new PhysicalFileProvider( 
          Path.Combine(env.ContentRootPath, "wwwroot/_content/Syncfusion.Blazor/scripts")), 
          RequestPath = "/_content/Syncfusion.Blazor" 
      }); 
} 
 
 
 
Kindly try with the above information and get back to us if you have any queries. 
 
Regards, 
Joshna L 
 



PN Péter N September 27, 2024 08:48 AM UTC

This not working. DirectoryNotFoundException.


SK Subathra Kaliamoorthy Syncfusion Team October 7, 2024 02:15 PM UTC

Hi Peter,


Apologies for the delay in response.


We have checked the reported issue for “DirectoryNotFoundException” at our end by developing a Blazor Server App in production mode using PhysicalFileProvider, but we were unable to replicate the issue on our end. Please ensure that ${user-name} is being replaced correctly, and use the following code snippets based on the package type you are using:

Overall Package:"C:\Users\${user-name}\.nuget\packages\syncfusion.blazor\{Version}\staticwebassets"
Individual Package: "C:\Users\${user-name}\.nuget\packages\syncfusion.blazor.themes\{Version}\staticwebassets"

Additionally, we recommend updating to the latest version of both the NuGet packages and the .NET framework to help resolve the issue. For further guidance, please refer to the attached sample and the following documentation link:

Getting started with Syncfusion Blazor Web App in Visual Studio

If you are still encountering the issue, please provide the following details:

  • Error details(Screenshot/ Video)
  • Package used (Individual or Overall)
  • Package Version

This information will help us provide a more accurate and prompt solution.


Regards,

Subathra K.


Attachment: BlazorAppDirectoryNotFound_f9e6a0d3.zip

Loader.
Up arrow icon