c# - 如何告诉 Blazor Webassembly 网站的访问者他们的浏览器不支持 Webassembly？

Question

我尝试了 Blazor Webassembly。我在 Visual Studio 中创建了一个新的 Blazor Webassembly 项目。这为我们提供了一个基本的示例项目，其中包含可以通过单击增加的计数器，获取一些数据的页面，......
当我在最新版本的 Firefox 中运行它时，它运行良好。
但后来我想:当我在不支持 Webassembly 的旧版 Firefox 中运行它时会发生什么？例如。 2017 年的 Firefox 50。
它只是显示了这一点。它不加载。没有其他事情发生:

查看 WebConsole 我发现了这个:

因此，Blazor Webassembly 应用程序知道它无法在该浏览器中运行，但不会告诉访问者。我们是否有一种简单的方法可以告诉用户问题是什么(也许指定一个替代的 HTML 文件)而不是说某事是“正在加载...”？

Answer 1

根据以下链接中的博客:
https://medium.com/@waelkdouh/how-to-detect-unsupported-browsers-under-a-blazor-webassembly-application-bc11ab0ee015
您可以让 Blazor 开始使用延迟加载，并显式启动 Blazor。
这使您可以仅在当前浏览器支持时加载，否则向用户显示一条消息。
本质上，您需要将以下脚本添加到 Index.html:

    <!--prevent autostarting-->
<script src="_framework/blazor.webassembly.js" autostart="false"></script>

<script>

    //check if webassembly is supported
    const webassemblySupported = (function () {
        try {
            if (typeof WebAssembly === "object"
                && typeof WebAssembly.instantiate === "function") {
                const module = new WebAssembly.Module(
                    Uint8Array.of(0x0, 0x61, 0x73, 0x6d,
                        0x01, 0x00, 0x00, 0x00));
                if (module instanceof WebAssembly.Module)
                    return new WebAssembly.Instance(module)
                        instanceof WebAssembly.Instance;
            }
        } catch (e) {
        }
        return false;
    })();

    // Modern browsers e.g. Microsoft Edge
    if (webassemblySupported) {
        Blazor.start({});
    }
    // Older browsers e.g. IE11
    else {
        window.location = window.location + "BrowserNotSupported.html";
    }

</script>

请注意，第一个脚本应该已经存在，但您需要确保它使 Blazor 延迟加载。