请问如何在react里用上web worker

发布于 2022-09-11 18:47:45 字数 54 浏览 24 评论 0

会报错误Uncaught SyntaxError: Unexpected token <

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

℡寂寞咖啡 2022-09-18 18:47:46

你好,请问你最后怎么解决这么问题的呢?

夜血缘 2022-09-18 18:47:46

webworker创建有两种方式,一种是引入外部js,还有一种是用就是脚本字符串的方式
1.
new Worker('worker.js')
2.

var blob = new Blob([document.querySelector('#worker').textContent]); // textContent为字符串脚本
var url = window.URL.createObjectURL(blob);
var worker = new Worker(url);

react中引入外部js会报错,可以考虑使用第二种方式创建Worker

参考阮一峰大大的文章 http://www.ruanyifeng.com/blo...

3.针对react项目的代码可能需要经过webpack打包。所以引入外部worker.js可能导致路径不对,可以将外部worker.js放在项目根目录,和html同一个目录,这样创建worker的时候就不会报错了!测试有效哦

// 组件内部
const worker = new Worker('./uploadWorker.js');

clipboard.png

栀梦 2022-09-18 18:47:45
const workercode = () => {

  self.onmessage = function (e) {
    postMessage ('123213')
  }

}

let code = workercode.toString()
code = code.substring(code.indexOf('{')+1, code.lastIndexOf('}'))

const blob = new Blob([code], {type: 'application/javascript'})

const worker_script =  URL.createObjectURL(blob)


export default worker_script
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文