Blazor Server 在现代浏览器中显示空白页面答案

【问题标题】：Blazor Server shows empty page in modern browsersBlazor Server 在现代浏览器中显示空白页面
【发布时间】：2021-04-26 06:22:19
【问题描述】：

我在 http://dev.softwaretechnik.it 运行一个 blazor 服务器网站

很遗憾，以下是最低浏览器版本要求。

Firefox 78（2020-06-30 !!）（当前为 84）
Edge 80 (2020-02-07 !!)（当前为 87）
Opera 53（2018-05-12 ！）（当前 71）
Chrome 66（2018-04-17 ！）（当前 87）

旧版本只会显示空白页。什么？！

会不会是 NET 5 的 css 隔离特性造成的？

编辑：请参阅下面的答案。

该站点是托管在 GitHub 上的开源社区项目。

_Host.cshtml：https://github.com/CleanCodeX/WebApp.SoE/blob/main/Pages/_Host.cshtml

Startup.cs：https://github.com/CleanCodeX/WebApp.SoE/blob/main/Startup.cs

其余的几乎都是标准的。

有什么线索吗？

【问题讨论】：

开发工具向您展示了什么？控制台中有任何 404 或错误吗？
它说：i.ibb.co/ZmxSJgS/Uncaught-Error.png 对于 blazor.server.js 第 1 行。这很可能不是错误。之后我尝试添加 polyfill，但结果相同。（仅对 IE 有帮助，但对导致问题的 ES6 没有帮助）

标签： c# blazor blazor-server-side asp.net-blazor

【解决方案1】：

我不知道是否有人仍然有这个问题，但我遇到了类似的问题，在查看我的代码后，我使用了一个布局，但没有在其中调用 @Body。在我的例子中，它是 mainLayout。

【讨论】：

你能补充更多细节吗？这个问题不涉及mainLayout，所以请edit你的答案解释更多！ :)

【解决方案2】：

很好奇，虽然 firefox 77 无法加载 blazor.server.js，但下面的脚本说它支持一堆 ES6 功能。

Firefox 缺少哪些阻止加载 Blazor 库的功能？

function HasEs6Support() {
    "use strict";

    if (typeof Symbol == "undefined") return false;
    try {
        // Arrow functions support
        () => {};

        // Class support
        class __ES6FeatureDetectionTest {
        };

        // Object initializer property and method shorthands
        let a = true;
        let b = {
            a,
            c() {
                return true;
            },
            d: [1, 2, 3],
        };

        // Object destructuring
        let { c, d } = b;

        // Spread operator
        let e = [...d, 4];

        return true;
    } catch (e) {
        return false;
    }
}

此外，根据https://kangax.github.io/compat-table/es6/ 的功能列表

firefox 77 和 78 没有区别。但区别在于，78 正确加载页面，而 77 则没有。

我不知道为什么。

【讨论】：