如何解决现有ASP.NET Core Razor应用Identity区域Blazor组件失效问题

问题分析与修复步骤 #

1. 修正中间件顺序 #

你的UseBlazorFrameworkFiles()和UseStaticFiles()调用顺序错误，Blazor框架文件需要优先于静态文件被处理。修改Startup.cs中的中间件配置：

app.UseHttpsRedirection();
// 先注册Blazor框架文件处理逻辑
app.UseBlazorFrameworkFiles();
app.UseStaticFiles();

app.UseRouting();

app.UseAuthentication();
app.UseAuthorization();

app.UseEndpoints(endpoints =>
{
    endpoints.MapHub<AmarbarHub>("/AmarbarHub");
    endpoints.MapRazorPages();
    endpoints.MapControllers();
    endpoints.MapBlazorHub();
});

2. 在Identity页面导入组件命名空间 #

在ManageUsers.cshtml页面顶部，添加CountComponent所在的命名空间引用，示例如下：

@using YourProjectName.Components

3. 调整组件渲染模式 #

ServerPrerendered预渲染模式在Identity这类需要授权的页面中，可能因预渲染阶段无用户上下文引发异常，尝试改用纯服务器端渲染模式：

<component type="typeof(CountComponent)" render-mode="Server" />

4. 确认Blazor脚本路径 #

将页面中的脚本引用改为绝对路径，避免区域路径解析偏差：

<script src="/_framework/blazor.server.js"></script>

5. 检查页面布局配置 #

如果ManageUsers.cshtml使用了自定义布局，确保布局文件中没有重复或错误引用Blazor脚本，且脚本放置在</body>标签之前。

内容的提问来源于stack exchange，提问作者Arash.Zandi