Blazor 8 Uncaught SyntaxError: Unexpected token '<'

Greg Finzer 0

I am stuck trying to convert from Blazor 7 Server to Blazor 8 Server. I am just about ready to give up, I don't think it is possible to use Blazor 8 with this defect in Blazor. I am using Blazor 8 Server. It is rendering CSS and JavaScript static files as garbage.

Here is my code for the App.razor

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="/" />
    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0-9/css/all.min.css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <link href="https://cdn.syncfusion.com/blazor/26.1.35/styles/bootstrap5.css" rel="stylesheet" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
    <link href="css/bedBrigade/theme.css" rel="stylesheet" />
    <link href="css/bedBrigade/navbar-top-fixed.css" rel="stylesheet" />
    <link href="css/open-iconic/font/css/open-iconic-bootstrap.min.css" rel="stylesheet" />
    <link href="css/site.css" rel="stylesheet" />
  
    @* This is required for component styles to work *@
    <link rel="stylesheet" href="BedBrigade.Client.styles.css" />
    <link rel="icon" type="image/x-icon" href="favicon.ico" />
    <HeadOutlet @rendermode="RenderMode.InteractiveServer" />
</head>
<body>
<Routes @rendermode="RenderMode.InteractiveServer" />
    @* This is required for Blazor to work *@
    <script src="_framework/blazor.web.js" type="text/javascript"></script>
  
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
    <script src="https://cdn.syncfusion.com/blazor/26.1.35/syncfusion-blazor.min.js"></script>
    <script src="js/AddRemoveClass.js" type="text/javascript"></script>
    <script src="js/SetGetValue.js" type="text/javascript"></script>
    <script src="js/DisplayToggle.js" type="text/javascript"></script>
    <script src="js/script.js" type="text/javascript"></script>
  
</body>
</html>

Here is the error in the console:

AddRemoveClass.js:1 Uncaught SyntaxError: Unexpected token '<'

SetGetValue.js:1 Uncaught SyntaxError: Unexpected token '<' DisplayToggle.js:1 Uncaught SyntaxError: Unexpected token '<' script.js:1 Uncaught SyntaxError: Unexpected token '<'

Here is the garbage that Blazor is returning for the site.css file which is a simple CSS file:

<!DOCTYPE html> <html lang="en"><head><meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <base href="/"> <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0-9/css/all.min.css"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link href="https://cdn.syncfusion.com/blazor/26.1.35/styles/bootstrap5.css" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"> <link href="css/bedBrigade/theme.css" rel="stylesheet"> <link href="css/bedBrigade/navbar-top-fixed.css" rel="stylesheet"> <link href="css/open-iconic/font/css/open-iconic-bootstrap.min.css" rel="stylesheet"> <link href="css/site.css" rel="stylesheet"> <link rel="stylesheet" href="BedBrigade.Client.styles.css"> <link rel="icon" type="image/x-icon" href="favicon.ico"> <!--Blazor: {
    "type":"server","prerenderId":"e54eaffc70924f8593c175a59f1a74fc","key": {
        "locationHash":"77D12F14A8105320B1AAED6AE7E689DA0EC4483270A645E84079EAA0FFDF550D:5","formattedComponentKey":""
    }
    ,"sequence":0,"descriptor":"CfDJ8PIq19D\u002BWmZHtrybL9W6q67GwUo/zmonht\u002BhZHmyTcrBf5EC0hmQppSavSqONfKS9uLoIfBWpu4nm6QEqf7UdaDY/eiAe9V/12Q2zRmCTFhxolb6xcTBmVAYI4yt09wnbGqL5JlE3sWhAXfCjvSwYvxwXncYgkJA9MM1YrYEx6nZT0SPk/N6q7zUc\u002BrhBpE4utkQRqM16xBnS5EmKMG3tQAds5srnL/qGLVHKGtdaPcCGo\u002B6iconH0DcfzCmNEkiRAhosrLBuPdqUzCfSUJQBgyzOQLKdAVnl5bMTup2pYp5eAH7mKDoA1GwJvW\u002B0T7zQ/IFAAJJCyp8EARpdlnnPsMIu/jZPY8hXiIJkDEPJxNPk9ETSjfC21RE7TyvvISb0iNmJyz\u002BeZv6HcL7C8dTJ6SSAM4hT50kurLv0Sub7Nt3R1cC0LoDbHkOVxj4E2YjCk1DUK4LczsoFui9\u002BjrAxF0716dt93nL\u002BHPAPJLke6kBf0L15y9Yo40miX8N8QKWYW5YQvtbtibdWgLO9qcAgguGDol7\u002BMJN61x6r9aGCgMEF7oZ5R\u002BOybsq5DFKQQrHzQzinHL3rETZIjGPxLzctJg="}
--><!--Blazor: {
    "prerenderId":"e54eaffc70924f8593c175a59f1a74fc"
}
--></head> <body><!--Blazor: {
    "type":"server","prerenderId":"63716ad6c2464eb39d2410ab64d65696","key": {
        "locationHash":"CBD0F45BE278BF61834376C5626B28A84F6A9DFADE125DA9F45A7F66CFB6E29E:8","formattedComponentKey":""
    }
    ,"sequence":1,"descriptor":"CfDJ8PIq19D\u002BWmZHtrybL9W6q65f4IBUmFkERfGhGQ5kJv070gdGJMsa9cbqnjDpF1o/erybCZbuTJTA9iqElnaixtv8A\u002B8xoZC96y1SHS5LG0ZaolT9FdxiZzVbvqfC9W5yVTIS\u002Byw57yDvJtwrhLg0ArayJStNVlgCT3R9sicueuQ8yBxC3ozIHIigZJwH3XtOcmhVeQk6R/kzY5fHZqETAn38MiA\u002BHi8QDRd2FLH4M3Cva9JGCFxDUU4lPGPIC\u002BM1M1QaTh46uOTcgikfoAYKdnN0lA3N5eVOziEqpRWIHOwsYZuJ7SLD0KDC5EyhPEWYsN6pu5nXpTF5Tz3L3ksX3TqFy5GXIYeaOjH87zc/7wkQI4YFmfHa3sl9wQOpOeD44yMOwRawZ8s6t7LrQcfaKTuTJ3baukbMFy\u002BwzuYdMcaDs/P9kPMU1Tz5ExjJqULajHzBONynL0Ketco2fJEQL0RVzWU1j4rxw6gFJDMvi6M\u002B6nxiYrWW1bysg1LotMMJjZpnDgQMRxYOu6b62Cl85LB5iTUz3wjECMKkCzwZdEzT"}
--><div class b-a7icp264bw> This is the header <style b-n0xrkznw31> .nadmin, .ladmin, .lsched, .ltreasure, .lauthor, .neditor, .leditor {
    display: none;
}
#edit, #admin, #manage {
    cursor: pointer;
    font-size: 15px;
    font-family: Comfortaa, cursive;
}
#edit::after, #admin::after, #manage::after {
    content: '';
}
</style> <main b-a7icp264bw><article class="content px-4" b-a7icp264bw> This is the body </article></main> This is the footer </div><!--Blazor: {
    "prerenderId":"63716ad6c2464eb39d2410ab64d65696"
}
--> <script src="_framework/blazor.web.js" type="text/javascript"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> <script src="https://cdn.syncfusion.com/blazor/26.1.35/syncfusion-blazor.min.js"></script> <script src="js/AddRemoveClass.js" type="text/javascript"></script> <script src="js/SetGetValue.js" type="text/javascript"></script> <script src="js/DisplayToggle.js" type="text/javascript"></script> <script src="js/script.js" type="text/javascript"></script></body></html><!--Blazor-Server-Component-State: CfDJ8PIq19D+WmZHtrybL9W6q67n6HovTUdoPB7Ph4FsIXB5VejJlk9a11Y6Kqs209qmEZFRdQbivCOm8wTNwJ5VGZLl0VAOk+uR2+kIkrUqOHU8Tc9KOh1IPhA5NespkXIvAJf89U2Wq4zfagF/rFleCH+g25AiMmOjKLLfk3e6W1ZXGFma5Z9N0BnGSP1HQMD1AdfxiICFHfFkro6DznV0+eZK1FJvfYpAQjdyBvMkdRlDJs0M07Uan8nMU0NPUKVgLeRA3dPCOMkSy4vrwCpY3JzczavNuvOySugU0ONgZ/Vh9mNabGU83AmLS7+1RUDhH+97ME1JQbG80xGsWwkLcMcKYZrpZrxv20I9k+cZHqAPMZhpEDJ5snZ36fD0zF7jhPV52b0ecas3jrnlK6SIzDzoJmY1O+9Xxf6ADUYZW3ol+xpGQPh+SqC4IZp3j/k3a6H0iF7+l16zQ8WXatneZMFfTx3qdUf/plP9uL675l6321kws94s9msZODo4UvRprytx/oPjP+fXPzDwICRKcom0eEdSTHYLMBYWyMEsk6Sl-->

Ping Ni-MSFT 4,720 Reputation points Microsoft Vendor

2024-08-06T05:48:17.9033333+00:00

Hi @Greg Finzer, could you pls share what is your AddRemoveClass.js and SetGetValue.js?Make sure all your static files are accessible under the wwwroot directory and the paths are correct. If the issue persists, consider creating a minimal reproducible example to isolate the problem further.

2 answers

Bruce (SqlWork.com) 67,016 Reputation points

2024-08-05T19:39:42.2733333+00:00

you appear to have mapped js and ccs file to blazor routing, so you are getting the index page with a route request. probably bad configuration in program.cs. no guess what you have messed up.

you should create a .net 8 blazor app to see what the expected configuration is.
Please sign in to rate this answer.
Greg Finzer 0 Reputation points

2024-08-05T20:23:58.8+00:00

Here is what I have for my program.cs

using BedBrigade.Client;

var builder = WebApplication.CreateBuilder(args);

StartupLogic.ConfigureLogger(builder);

StartupLogic.AddServicesToTheContainer(builder);

var app = StartupLogic.CreateAndConfigureApplication(builder);

await StartupLogic.SetupDatabase(app);

await StartupLogic.SetupCaching(app);

//TODO: Renable later

//StartupLogic.SetupEmailQueueProcessing(app);

app.Run();

I put the logic organized into a StartupLogic.cs

using BedBrigade.Client.Components;

using BedBrigade.Client.Services;

using BedBrigade.Common;

using BedBrigade.Data;

using BedBrigade.Data.Seeding;

using BedBrigade.Data.Services;

using Blazored.SessionStorage;

using Microsoft.AspNetCore.Authentication.Cookies;

using Microsoft.AspNetCore.Components.Authorization;

using Microsoft.AspNetCore.Mvc;

using Microsoft.AspNetCore.StaticFiles;

using Microsoft.EntityFrameworkCore;

using Microsoft.Extensions.FileProviders;

using Serilog;

using Syncfusion.Blazor;

namespace BedBrigade.Client

{

public static class StartupLogic

{

private static ServiceProvider _svcProvider;

public static void ConfigureLogger(WebApplicationBuilder builder)

{

//Read logging configuration from appsettings.json

//See https://www.codeproject.com/Articles/5344667/Logging-with-Serilog-in-ASP-NET-Core-Web-API

var logger = new LoggerConfiguration()

.ReadFrom.Configuration(builder.Configuration)

.Enrich.FromLogContext()

.CreateLogger();

Log.Logger = logger;

builder.Logging.ClearProviders();

builder.Logging.AddSerilog(logger);

Log.Logger.Information("Starting Up");

}

public static void AddServicesToTheContainer(WebApplicationBuilder builder)

{

Log.Logger.Information("AddServicesToTheContainer");

// Add services to the container.

builder.Services.AddMvc(option => option.EnableEndpointRouting = false).SetCompatibilityVersion(CompatibilityVersion.Version_3_0);

builder.Services.AddRazorComponents()

.AddInteractiveServerComponents();

builder.Services.AddHttpContextAccessor();

builder.Services.AddDbContextFactory<DataContext>(options =>

{

options.UseSqlServer(builder.Configuration.GetConnectionString("DefaultConnection"), sqlBuilder =>

{

sqlBuilder.EnableRetryOnFailure(5, TimeSpan.FromSeconds(10), null);

});

options.UseQueryTrackingBehavior(QueryTrackingBehavior.NoTracking);

options.UseApplicationServiceProvider(_svcProvider);

});

builder.Services.AddHttpClient();

SetupAuth(builder);

ClientServices(builder);

DataServices(builder);

builder.Services.AddScoped<ToastService, ToastService>();

builder.Services.AddSignalR(e =>

{

e.MaximumReceiveMessageSize = 1024000;

});

//services cors

builder.Services.AddCors(p => p.AddPolicy("corsapp", builder =>

{

builder.WithOrigins("*").AllowAnyMethod().AllowAnyHeader();

}));

// Syncfusion Blazor Licensing

Syncfusion.Licensing.SyncfusionLicenseProvider.RegisterLicense(LicenseLogic.SyncfusionLicenseKey);

builder.Services.AddSyncfusionBlazor();

_svcProvider = builder.Services.BuildServiceProvider();

}

private static void SetupAuth(WebApplicationBuilder builder)

{

Log.Logger.Information("SetupAuth");

//Authentication

builder.Services.AddAuthorization();

//The cookie authentication is never used, but it is required to prevent a runtime error

builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme)

.AddCookie(options =>

{

options.Cookie.Name = "auth_cookie";

options.Cookie.MaxAge = TimeSpan.FromHours(24);

});

builder.Services.AddScoped<IAuthService, AuthService>();

builder.Services.AddScoped<AuthenticationStateProvider, CustomAuthStateProvider>();

builder.Services.AddCascadingAuthenticationState();

builder.Services.AddScoped<IAuthDataService, AuthDataService>();

builder.Services.AddBlazoredSessionStorage();

builder.Services.AddScoped<ICustomSessionService, CustomSessionService>();

}

private static void ClientServices(WebApplicationBuilder builder)

{

Log.Logger.Information("ClientServices");

builder.Services.AddSingleton<ICachingService, CachingService>();

builder.Services.AddScoped<ILoadImagesService, LoadImagesService>();

}

private static void DataServices(WebApplicationBuilder builder)

{

Log.Logger.Information("DataServices");

builder.Services.AddScoped<ICommonService, CommonService>();

builder.Services.AddScoped<IAuthDataService, AuthDataService>();

builder.Services.AddScoped<IUserDataService, UserDataService>();

builder.Services.AddScoped<IDonationDataService, DonationDataService>();

builder.Services.AddScoped<ILocationDataService, LocationDataService>();

builder.Services.AddScoped<IVolunteerDataService, VolunteerDataService>();

builder.Services.AddScoped<IConfigurationDataService, ConfigurationDataService>();

builder.Services.AddScoped<IContentDataService, ContentDataService>();

builder.Services.AddScoped<IVolunteerForDataService, VolunteerForDataService>();

builder.Services.AddScoped<IMediaDataService, MediaDataService>();

builder.Services.AddScoped<IDonationDataService, DonationDataService>();

builder.Services.AddScoped<IBedRequestDataService, BedRequestDataService>();

builder.Services.AddScoped<IScheduleDataService, ScheduleDataService>();

builder.Services.AddScoped<ITemplateDataService, TemplateDataService>();

builder.Services.AddScoped<IContactUsDataService, ContactUsDataService>();

builder.Services.AddScoped<IVolunteerEventsDataService, VolunteerEventsDataService>();

builder.Services.AddScoped<IEmailQueueDataService, EmailQueueDataService>();

}

public static WebApplication CreateAndConfigureApplication(WebApplicationBuilder builder)

{

Log.Logger.Information("Create and configure application");

var app = builder.Build();

//app.UsePathBase("/National");

// Configure the HTTP request pipeline.

if (!app.Environment.IsDevelopment())

{

app.UseExceptionHandler("/Error", createScopeForErrors: true);

// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseAntiforgery();

app.UseStaticFiles();

app.MapRazorComponents<App>()

.AddInteractiveServerRenderMode();

return app;

}

public static async Task SetupDatabase(WebApplication app)

{

Log.Logger.Information("Setup Database");

//Create database if it does not exist

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

try

{

var dbContextFactory = services.GetRequiredService<Microsoft.EntityFrameworkCore.IDbContextFactory<DataContext>>();

using (var context = dbContextFactory.CreateDbContext())

{

//if (app.Environment.IsDevelopment())

//{

Log.Logger.Information("Performing Migration");

await context.Database.MigrateAsync();

//}

}

Log.Logger.Information("Seeding Data");

await Seed.SeedData(dbContextFactory);

}

catch (Exception ex)

{

Log.Logger.Error(ex, "An error occurred during migration");

Environment.Exit(1);

}

}

public static async Task SetupCaching(WebApplication app)

{

Log.Logger.Information("Setup Caching");

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

var dbContextFactory = services.GetRequiredService<Microsoft.EntityFrameworkCore.IDbContextFactory<DataContext>>();

using (var context = dbContextFactory.CreateDbContext())

{

var config = await context.Configurations.FindAsync(ConfigNames.IsCachingEnabled);

if (config != null)

{

if (config != null)

{

var cachingService = services.GetRequiredService<ICachingService>();

cachingService.IsCachingEnabled = true;

bool isCachingEnabled;

if (bool.TryParse(config.ConfigurationValue, out isCachingEnabled))

{

cachingService.IsCachingEnabled = isCachingEnabled;

}

Log.Logger.Information(cachingService.IsCachingEnabled

? "Caching is enabled"

: "Caching is disabled");

}

}

}

}

public static void SetupEmailQueueProcessing(WebApplication app)

{

Log.Logger.Information("Setup Email Queue Processing");

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

var configurationDataService = services.GetRequiredService<IConfigurationDataService>();

var emailQueueDataService = services.GetRequiredService<IEmailQueueDataService>();

EmailQueueLogic.Start(emailQueueDataService, configurationDataService);

}

}

}

Greg Finzer 0 Reputation points

2024-08-05T20:28:35.15+00:00

Here is what I have for my program.cs

using BedBrigade.Client;

var builder = WebApplication.CreateBuilder(args);

StartupLogic.ConfigureLogger(builder);

StartupLogic.AddServicesToTheContainer(builder);

var app = StartupLogic.CreateAndConfigureApplication(builder);

await StartupLogic.SetupDatabase(app);

await StartupLogic.SetupCaching(app);

//TODO: Renable later

//StartupLogic.SetupEmailQueueProcessing(app);

app.Run();

I put the logic organized into a StartupLogic.cs

namespace BedBrigade.Client

{

public static class StartupLogic

{

private static ServiceProvider _svcProvider;

public static void ConfigureLogger(WebApplicationBuilder builder)

{

//Read logging configuration from appsettings.json

//See https://www.codeproject.com/Articles/5344667/Logging-with-Serilog-in-ASP-NET-Core-Web-API

var logger = new LoggerConfiguration()

.ReadFrom.Configuration(builder.Configuration)

.Enrich.FromLogContext()

.CreateLogger();

Log.Logger = logger;

builder.Logging.ClearProviders();

builder.Logging.AddSerilog(logger);

Log.Logger.Information("Starting Up");

}

public static void AddServicesToTheContainer(WebApplicationBuilder builder)

{

Log.Logger.Information("AddServicesToTheContainer");

// Add services to the container.

builder.Services.AddMvc(option => option.EnableEndpointRouting = false).SetCompatibilityVersion(CompatibilityVersion.Version_3_0);

builder.Services.AddRazorComponents()

.AddInteractiveServerComponents();

builder.Services.AddHttpContextAccessor();

builder.Services.AddDbContextFactory<DataContext>(options =>

{

options.UseSqlServer(builder.Configuration.GetConnectionString("DefaultConnection"), sqlBuilder =>

{

sqlBuilder.EnableRetryOnFailure(5, TimeSpan.FromSeconds(10), null);

});

options.UseQueryTrackingBehavior(QueryTrackingBehavior.NoTracking);

options.UseApplicationServiceProvider(_svcProvider);

});

builder.Services.AddHttpClient();

SetupAuth(builder);

ClientServices(builder);

DataServices(builder);

builder.Services.AddScoped<ToastService, ToastService>();

builder.Services.AddSignalR(e =>

{

e.MaximumReceiveMessageSize = 1024000;

});

//services cors

builder.Services.AddCors(p => p.AddPolicy("corsapp", builder =>

{

builder.WithOrigins("*").AllowAnyMethod().AllowAnyHeader();

}));

// Syncfusion Blazor Licensing

Syncfusion.Licensing.SyncfusionLicenseProvider.RegisterLicense(LicenseLogic.SyncfusionLicenseKey);

builder.Services.AddSyncfusionBlazor();

_svcProvider = builder.Services.BuildServiceProvider();

}

private static void SetupAuth(WebApplicationBuilder builder)

{

Log.Logger.Information("SetupAuth");

//Authentication

builder.Services.AddAuthorization();

//The cookie authentication is never used, but it is required to prevent a runtime error

builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme)

.AddCookie(options =>

{

options.Cookie.Name = "auth_cookie";

options.Cookie.MaxAge = TimeSpan.FromHours(24);

});

builder.Services.AddScoped<IAuthService, AuthService>();

builder.Services.AddScoped<AuthenticationStateProvider, CustomAuthStateProvider>();

builder.Services.AddCascadingAuthenticationState();

builder.Services.AddScoped<IAuthDataService, AuthDataService>();

builder.Services.AddBlazoredSessionStorage();

builder.Services.AddScoped<ICustomSessionService, CustomSessionService>();

}

private static void ClientServices(WebApplicationBuilder builder)

{

Log.Logger.Information("ClientServices");

builder.Services.AddSingleton<ICachingService, CachingService>();

builder.Services.AddScoped<ILoadImagesService, LoadImagesService>();

}

private static void DataServices(WebApplicationBuilder builder)

{

Log.Logger.Information("DataServices");

builder.Services.AddScoped<ICommonService, CommonService>();

builder.Services.AddScoped<IAuthDataService, AuthDataService>();

builder.Services.AddScoped<IUserDataService, UserDataService>();

builder.Services.AddScoped<IDonationDataService, DonationDataService>();

builder.Services.AddScoped<ILocationDataService, LocationDataService>();

builder.Services.AddScoped<IVolunteerDataService, VolunteerDataService>();

builder.Services.AddScoped<IConfigurationDataService, ConfigurationDataService>();

builder.Services.AddScoped<IContentDataService, ContentDataService>();

builder.Services.AddScoped<IVolunteerForDataService, VolunteerForDataService>();

builder.Services.AddScoped<IMediaDataService, MediaDataService>();

builder.Services.AddScoped<IDonationDataService, DonationDataService>();

builder.Services.AddScoped<IBedRequestDataService, BedRequestDataService>();

builder.Services.AddScoped<IScheduleDataService, ScheduleDataService>();

builder.Services.AddScoped<ITemplateDataService, TemplateDataService>();

builder.Services.AddScoped<IContactUsDataService, ContactUsDataService>();

builder.Services.AddScoped<IVolunteerEventsDataService, VolunteerEventsDataService>();

builder.Services.AddScoped<IEmailQueueDataService, EmailQueueDataService>();

}

public static WebApplication CreateAndConfigureApplication(WebApplicationBuilder builder)

{

Log.Logger.Information("Create and configure application");

var app = builder.Build();

//app.UsePathBase("/National");

// Configure the HTTP request pipeline.

if (!app.Environment.IsDevelopment())

{

app.UseExceptionHandler("/Error", createScopeForErrors: true);

// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseAntiforgery();

app.UseStaticFiles();

app.MapRazorComponents<App>()

.AddInteractiveServerRenderMode();

return app;

}

public static async Task SetupDatabase(WebApplication app)

{

Log.Logger.Information("Setup Database");

//Create database if it does not exist

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

try

{

var dbContextFactory = services.GetRequiredService<Microsoft.EntityFrameworkCore.IDbContextFactory<DataContext>>();

using (var context = dbContextFactory.CreateDbContext())

{

//if (app.Environment.IsDevelopment())

//{

Log.Logger.Information("Performing Migration");

await context.Database.MigrateAsync();

//}

}

Log.Logger.Information("Seeding Data");

await Seed.SeedData(dbContextFactory);

}

catch (Exception ex)

{

Log.Logger.Error(ex, "An error occurred during migration");

Environment.Exit(1);

}

}

public static async Task SetupCaching(WebApplication app)

{

Log.Logger.Information("Setup Caching");

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

var dbContextFactory = services.GetRequiredService<Microsoft.EntityFrameworkCore.IDbContextFactory<DataContext>>();

using (var context = dbContextFactory.CreateDbContext())

{

var config = await context.Configurations.FindAsync(ConfigNames.IsCachingEnabled);

if (config != null)

{

if (config != null)

{

var cachingService = services.GetRequiredService<ICachingService>();

cachingService.IsCachingEnabled = true;

bool isCachingEnabled;

if (bool.TryParse(config.ConfigurationValue, out isCachingEnabled))

{

cachingService.IsCachingEnabled = isCachingEnabled;

}

Log.Logger.Information(cachingService.IsCachingEnabled

? "Caching is enabled"

: "Caching is disabled");

}

}

}

}

public static void SetupEmailQueueProcessing(WebApplication app)

{

Log.Logger.Information("Setup Email Queue Processing");

using var scope = app.Services.CreateScope();

var services = scope.ServiceProvider;

var configurationDataService = services.GetRequiredService<IConfigurationDataService>();

var emailQueueDataService = services.GetRequiredService<IEmailQueueDataService>();

EmailQueueLogic.Start(emailQueueDataService, configurationDataService);

}

}

}
Sign in to comment

Use comments to ask for clarification, additional information, or improvements to the question.
Greg Finzer 0 Reputation points

2024-08-06T13:08:36.84+00:00

This is a defect in Blazor 8. Blazor 8 cannot handle a root path variable. Example:

@page "/{mylocation}/{mypageName}"

If you change it to this, it works:

@page "pages/{mylocation}/{mypageName}"I have submitted an issue to Microsoft:

https://github.com/dotnet/aspnetcore/issues/57192

I have also created a sample project with the steps to reproduce here:

https://github.com/GregFinzer/Blazor8RootPathVariable
Please sign in to rate this answer.
Bruce (SqlWork.com) 67,016 Reputation points

2024-08-06T19:45:39.8933333+00:00

its a bug in your code. your .js and .css files are relative paths. as you specified base "href" they should be absolute (start with "/"). when you add the root path, this changes the url, such that the static file handler does not process the request, but rather its a request that creates a new blazor app to processes the request, which returns the bootstrap html.

if you look at the urls in the browsers network trace you will see the error.

Greg Finzer 0 Reputation points

2024-08-12T13:34:57.5733333+00:00

This is the workaround provided by Microsoft after they introduced this bug in Blazor 8.

This worked in Blazor 7 but not in Blazor 8:

@page "/{mylocation}/{mypageName}"

You have to put this in Blazor 8:

@page "/{mylocation}/{mypageName:nonfile}"
Sign in to comment

Use comments to ask for clarification, additional information, or improvements to the question.

Share via

Blazor 8 Uncaught SyntaxError: Unexpected token '<'

2 answers

Your answer