javascript - Web Worker onMessage 在 IE11 中为 null

Question

我在我的 React 应用程序的 IE11 中收到错误“Promise is Undefined”。当我在代码中使用 Worker 时

const worker = new Worker('./worker.ts')
console.log('worker' , worker);

当我在 Chrome 和 IE 11 中检查日志时，Chrome 返回 worker onMessage 作为函数，而 IE 11 返回 null，我还看到消息“权限被拒绝”。我还在 IE 11 中收到此错误“Promise is Undefined”。

我在文件的开头导入了 import 'babel-polyfill'。除了这个 Worker，所有其他 Promise 都工作正常。

我该如何解决这个问题？

Answer 1

React 可能无法立即与 IE 兼容，

来自官方文档:

React 支持所有流行的浏览器，包括 Internet Explorer 9 及更高版本，尽管旧浏览器(如 IE 9 和 IE 10)需要一些 polyfill。

We don’t support older browsers that don’t support ES5 methods, but you may find that your apps do work in older browsers if polyfills such as es5-shim and es5-sham are included in the page. You’re on your own if you choose to take this path.

---

要使您的应用程序在 IE(11 或 9)上运行，您必须安装 React-app-polyfill:

https://www.npmjs.com/package/react-app-polyfill

特点:

每个 polyfill 确保存在以下语言特性:

Promise (for async / await support)
window.fetch (a Promise-based way to make web requests in the browser)
Object.assign (a helper required for Object Spread, i.e. { ...a, ...b })
Symbol (a built-in object used by for...of syntax and friends)
Array.from (a built-in static method used by array spread, i.e. [...arr])

用法

首先，使用 Yarn 或 npm 安装包:

npm install react-app-polyfill

现在，您可以导入您打算支持的最小版本的入口点。例如，如果您导入 IE9 入口点，这将包括 IE10 和 IE11 支持。

互联网浏览器 9

// This must be the first line in src/index.js
import 'react-app-polyfill/ie9';

// ...

互联网浏览器 11

// This must be the first line in src/index.js
import 'react-app-polyfill/ie11';

// ...

---

您还可以使用以下文档配置您的 list 以处理不同的浏览器:https://github.com/browserslist/browserslist

例子:

"browserslist": [
    ">0.2%",
    "not dead",
    "ie >= 9"
]