SaaS CMS has officially launched! Learn more now.

Mark Stott
Sep 23, 2022
  2500
(3 votes)

404 Error on Static Assets Within an Optimizely plugin

Background

With the move to CMS 12 and .NET 5/6, developers are now able to build Plugins and Extensions using Razor Class Libraries (RCL).  These are a fantastic option as it allows you to bundle up any client side scripts, styles and razor files into the same compiled dll as your buisness logic.  The structure of the Razor files and static files within an RCL is the same structure as what you would expect to see within a Web project.

The biggest benefit is that it makes it very clean to install and remove said plugin as it does not require any zip files to be deployed into a modules folder and really compartmentalizes your plugin.  To date I have built two different plugins which utilize Razor Class Libraries:

The Problem

I was contacted by Praveen Soni on the Optimizely Community slack about an issue they were encountering.  In development the Stott.Optimizely.RobotsHandler module was working as anticipated, however when it deployed into DXP they were receiving a 404 error on the following file: 

https://example.dxcloud.episerver.net/_content/Stott.Optimizely.RobotsHandler/RobotsAdmin.js  

Praveen and I chatted some more, we talked about the requirements within the startup.cs file, I got them to share their error logs in hopes of trying to understand why this javascript file from the Razor Class Library was not being served.

I later stumbled upon this article that resonated with the issue that we were encountering: How to deal with the "HTTP 404 '_content/Foo/Bar.css' not found" when using Razor component package on ASP.NET Core Blazor app and this led me back to this article on the microsoft website Create reusable UI using the Razor class library project in ASP.NET Core 

The Solution

If your Razor Class library includes Razor Pages, then the following methods need to called with the the Startup.cs of the consuming application:

services.AddRazorPages();

app.MapRazorPages();

If your Razor Class library includes static files like .css and .js files, then a call to UseStaticWebAssetts() must be used in the Program.cs of the consuming application:

public static class Program
{
    public static void Main(string[] args) => CreateHostBuilder(args).Build().Run();

    public static IHostBuilder CreateHostBuilder(string[] args) =>
        Host.CreateDefaultBuilder(args)
            .ConfigureCmsDefaults()
            .ConfigureWebHostDefaults(webBuilder =>
            {
                webBuilder.UseStartup<Startup>();
                webBuilder.UseStaticWebAssets();
            });
}

Now here is the fun part: if the ASPNETCORE_ENVIRONMENT environment variable is set to Development, then .NET automatically includes a call to UseStaticWebAssets(), if it is set to any other value, then you have to manually add this to your code!  It is this final part of the puzzle which explains why the code worked perfectly in some environments but failed in others.

Sep 23, 2022

Comments

Surjit Bharath
Surjit Bharath Sep 23, 2022 08:17 AM

Great information, thanks Mark.

Praveen Soni
Praveen Soni Sep 23, 2022 09:32 AM

Thanks Marks, for this solution

Mark Stott
Mark Stott Sep 23, 2022 09:50 AM

Thank you both. I'm glad the issue has been identified and fixed for you Praveen :)

Graham Carr
Graham Carr Sep 23, 2022 12:22 PM

Thanks Mark, for the solution and resolving it so quickly!!

Please login to comment.
Latest blogs
A day in the life of an Optimizely Developer - London Meetup 2024

Hello and welcome to another instalment of A Day In The Life Of An Optimizely Developer. Last night (11th July 2024) I was excited to have attended...

Graham Carr | Jul 16, 2024

Creating Custom Actors for Optimizely Forms

Optimizely Forms is a powerful tool for creating web forms for various purposes such as registrations, job applications, surveys, etc. By default,...

Nahid | Jul 16, 2024

Optimizely SaaS CMS Concepts and Terminologies

Whether you're a new user of Optimizely CMS or a veteran who have been through the evolution of it, the SaaS CMS is bringing some new concepts and...

Patrick Lam | Jul 15, 2024

How to have a link plugin with extra link id attribute in TinyMce

Introduce Optimizely CMS Editing is using TinyMce for editing rich-text content. We need to use this control a lot in CMS site for kind of WYSWYG...

Binh Nguyen Thi | Jul 13, 2024