使用网络工作者，jquery returns 未定义

Question

我正在尝试制作一个网络工作者，它将每隔 n 毫秒从服务器获取一些东西作为我需要的东西的 poc。但是我有一个问题，我正在尝试在我的 webworker 中使用 $.ajax，即使我在 html 文件中定义了 jquery，它也会说 $ 未定义，我不知道如何在我的 worker.js 文件中使用 jquery。我认为主要问题是，当我创建一个工作人员时，我将文件指定为“new Worker("worker.js");”，我认为这与 jquery 混淆了，因此 jquery 没有关联和我的工人 js。我可能弄错了。我不知道我该如何解决这个问题。

这是我的 html 文件：

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="worker.js"></script>
</head>
<body>

<p>output: <output id="result"></output></p>
<button onclick="worker()">Start Worker</button>

<script>
var w;

function worker() {
        w = new Worker("worker.js");
        w.onmessage = function(event) {
            document.getElementById("result").innerHTML = event.data;
        };
}
</script>

</body>
</html>

我并不完全需要在我的 header 中引用 worker.js，我只是想检查一下如果我添加它会有什么不同，但它没有.

这是我的工人：

var i = 0;

function someAjax (){
    $.get("https://httpbin.org/get", function(data, status){
        return data;
    });
}
function doSomething() {
    var test = someAjax();
    postMessage(test);
    setTimeout("doSomething()",500);
}

doSomething();

worker 中的那个网站是我在网上找到的一些随机网站，用于测试网络服务，在我这边，我正在查询我的本地主机。

我收到的消息是 ReferenceError: $ is not defined 所以我正在寻找一种方法来在我的 worker.js

中获取 $

Answer 1

默认的 jQuery 脚本不能在 WorkerGlobalScope 线程中使用，因为 WorkerGlobalScope 没有 document，这将导致 TypeError .createElement() 在 jQuery 中被调用。您也可以在 Worker 线程中使用 fetch()。正如@epascarello 所指出的那样，在 .then() 处理程序中调用 postMessage() 以 post 将数据发送到主线程

var i = 0;

function someAjax () {
    // note `return` statement
    return fetch("https://httpbin.org/get")
           .then(response => response.text())
           .catch(err => { throw err })
}
function doSomething() {
    var test = someAjax();
    someAjax().then(test => {
      postMessage(test);
      setTimeout("doSomething()",500);
    })
    // handle error here
    .catch(err => console.error(err))  
}

doSomething();

使用网络工作者，jquery returns 未定义

Using webworkers, jquery returns undefined

javascript

ajax

jquery

web-worker