4

我是 Blazor/WebAssembly 的新手,喜欢这项技术,但不了解某些实现细节背后的原因。

例如,如果用户使用不支持 WebAssembly(即 IE 11)的浏览器导航到由 Visual Studio 向导创建的客户端 Blazor/WebAssembly 应用程序,则该网站将仅显示

Loading...

永远。

原因很清楚,但微软为什么要这样实施呢?尝试检测浏览器是否支持 WebAssembly 以及如果不支持 - 将用户重定向到另一个静态页面解释原因(即“您的浏览器不支持 WebAssembly,请使用 Chrome v. XX 或以上,Edge v. XX 或以上等”)?

4

3 回答 3

3

我不是微软的员工,但在我看来,他们这样做是出于以下原因。

a) MS 是为开发人员提供工具和技术的提供商。因此,他们不会为开发人员做出决定。他们通常不会创建“选择性”框架。并且显示“不支持”的消息是他们的明确意见。他们的所有客户都拥有该信息是没有意义的。如果有人愿意在 IE11 上进行这项工作并且他们阻止了他们怎么办?

b) 像这样实施它需要零努力。这对自己有利。如果他们心中有防弹解决方案,那么如果他们想支持它,我对他们实施它的怀疑为零。目前,由于它不受支持,因此开发人员有责任为最终用户提供适当的 UX。由开发人员决定如何处理 IE。提供消息,声明不支持 IE11,添加像https://github.com/Daddoon/Blazor.Polyfill这样的 poilyfill以在一定程度上支持 IE11,或者切换到不同的技术。如果 MS 会给出会显示消息的解决方案,它需要其他想要使用polyfill的开发人员,或者切换到不同的技术来主动禁用此类检查,并且它需要实现更多的移动部件,只是为了不支持平台。这根本没有意义。

c) 对 IE11 的支持需求正在下降,投资支持这个市场可能不值得他们关注。WebAssembly 的技术还不够成熟,他们只在 2020 年上半年发布什么东西,到那时 IE11 会是多少?而这只是第一次迭代,其他重要的里程碑甚至更晚被推动,因此 IE11 很可能不值得努力。

于 2019-10-13T14:59:16.690 回答
1

不久前我偶然发现了一篇关于此的博客文章(忘记了来源,没有为这项工作获得荣誉),这是解决这个确切问题的方法 - 检测是否支持 Webassembly,如果不支持,则重定向到“不支持浏览器” html页面。它完全按照您上面概述的方式工作。

这是要在WASM 服务工作者注册 之前添加的 JavaScript 片段,例如navigator.serviceWorker.register('service-worker.js');

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) {
        console.error('Failed to verify if webassembly is supported, assuming no.');
    }
    return false;
})();

// Modern browsers e.g. Edge/Chrome/Safari/Firefox/etc.
if (webassemblySupported) {
    Blazor.start({});
}
// Older browsers e.g. IE11
else {
    window.location = window.location + "NotSupported.html";
}
于 2021-03-18T00:29:23.437 回答
1

我同意你的观点,但谁知道他们可能会在主版本中包含这个功能。目前 Blazor.wasm 是预览版。现在,您可以在 index.html 中使用这样的简单解决方案:

<script>
  var ua = window.navigator.userAgent;
  var isIE = /MSIE|Trident/.test(ua);

  if ( isIE ) {
    alert("Internet Explorer browser is not supported. Please use a more modern browser like Google Chrome, Microsoft Edge, Mozilla Firefox, Opera, Safari, etc.");
  }
</script>

希望对您有所帮助:) PS 如果您不想使用脚本,我认为这也可以通过 CSS 来完成。

于 2019-11-28T12:12:58.810 回答