关于 SharedWorkers 的一些注释

发布日期： 2024-11-03 阅读量： 作者： 网络

关于 sharedworkers 的一些注释

我最近需要在一个项目中实现一个共享工作线程。尽管它们非常有用，但在通常的地方找不到太多信息，因此这里有一些提示可能会帮助来自神秘未来的搜索者。

背景

sharedworkers 是一类特殊的 webworker，可以在多个选项卡、窗口或其他（常规）web worker 之间共享。

在我的应用程序中，我需要一个流程来轮询新的应用程序事件（例如，客户完成购买），并向登录的管理员（或更具体地说，那些登录的管理员）显示通知（使用通知 api）在选择接收通知的管理员中）。

管理员可以在多个选项卡或窗口中打开应用程序，因此让每个选项卡轮询新事件会很浪费。无论打开的选项卡或窗口有多少，我只希望每个事件有一个通知。

sharedworker 来救援！每个打开的选项卡或窗口共享一个工作程序，该工作程序在后台进行轮询，并且每个新事件仅显示一个通知。

使用vite创建共享worker

第一个挑战是在我基于 vite 的设置中加载共享工作线程。

如果您在开发模式下运行 vite，vite 会从不同的域和端口（例如 http://[::1]:5173/）提供脚本，这是行不通的，因为共享工作线程必须遵守同源策略。

我为网络工作者尝试了各种 vite 解决方法：

由于同源政策要求，官方的 vite web worker 方法不适用于共享 worker。
共享工作线程不支持 blob url。
将工作线程内联为 base64 字符串不起作用，因为浏览器将它们视为不同的工作线程：对于网络工作线程来说很好，但对于共享工作线程则不然。

最后，我创建了一条新路由来从开发中的资源目录或暂存和实时环境中的构建目录提供脚本。

route::addroute('get', '/notifications-shared-worker.js', function () {
    // if in dev environment, send the file from the resources folder
    if (app()->environment('local')) {
        return response()->file(resource_path('js/notificationwatcherworker.js'), ['content-type' => 'text/javascript']);
    } else {
        // otherwise, send the file from the public folder
        return response()->file(public_path('build/assets/notificationwatcherworker.js'), ['content-type' => 'text/javascript']);
    }
});

上一篇: linux怎么查看进程在哪个cpu上

下一篇: 循环复杂度如何影响 PHP 函数的代码覆盖率

关于 SharedWorkers 的一些注释

随便看看