首页 > 解决方案 > 使用 MVC 预渲染的 Blazor WASM。控制器将 /[controller]/... 附加到操作路径并且不加载 _framework/blazor.boot.json

问题描述

我有点咸菜。我不确定我的设置有多标准,所以我将简要介绍一下。

我们有一个项目,我们在其中设置了 MVC 和 API 服务端点。它工作得很好。我最近读到,您可以使用以下方式将 Blazor 组件混合到 MVC 项目中:

@(await Html.RenderComponentAsync<BlazorComponents.Components.SelectExmpleComponent>(RenderMode.WebAssemblyPrerendered, new {Options = operatorRoles}))

这实际上效果很好!我必须设置一个 Blazor 客户端项目并搞乱启动配置,但我成功地让 Blazor 几乎立即加载预渲染。然后它在后台下载所需的组件,所有绑定都可以工作。我对此非常满意,我可以看到这极大地提高了生产力。

就在我准备称其为巨大成功时,我们发现了一个泡菜。显然,我所有的初始测试都是在默认控制器上完成的。一旦我将它移动到不同的控制器,浏览器就会将控制器路径附加到所有传出请求。对于初始的 JavaScript 导入,我可以绕过它:

<script src="@Url.Content("~/_framework/blazor.webassembly.js")"></script>

但是这个脚本在内部加载了其他组件,例如第一个是 _framework/blazor.boot.json ,我得到:

加载资源失败:服务器响应状态为 404 () _framework/blazor.boot.json

经过进一步检查,事实证明浏览器正在询问 [Root Domain]/[Controller]/_framework/blazor.boot.json ,这显然是不正确的。

我不确定如何解决这个问题。我们目前采用的一种解决方法是不在路由中使用控制器,并确保每条路由都是唯一的……但这对我来说有点不合时宜,我喜欢将控制器分离到控制器中。我也可以手动放置所有依赖文件并将它们放入静态资源文件夹并通过@Url.Content() 指令引用它们,但这也感觉有点hacky。

有没有更清洁的方法?作为参考,我将在 Startup 中包含我当前的 Configure 方法:

// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
            app.UseWebAssemblyDebugging();
        }
        else
        {
            app.UseExceptionHandler("/Error");
            // 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.UseSession();
        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseBlazorFrameworkFiles();

        app.UseRouting();

        app.UseAuthorization();
        app.UseAuthentication();
        
        app.UseEndpoints(endpoints =>
        {
            endpoints.MapRazorPages();
            endpoints.MapControllers();
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller=Home}/{action=Index}");
        });
    }

标签: asp.net-mvc.net-coreblazor-webassembly

解决方案


推荐阅读