我正在開發一個嚴重依賴網路作業者的程式。但我無法讓它們按要求運行。這只是一個縮小的示例,但格式或多或少相似。
我有 4 個檔案:
索引.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello World!</title>
</head>
<body>
<button id="btn">GO</button>
<script src="./index.js" type="module"></script>
</body>
</html>
index.js
const worker = new Worker("./worker.js", {type: "module"})
worker.addEventListener("message", async ({ data }) => {
console.log(data);
});
worker.onerror = function (event) {
throw new Error(event.message " (" event.filename ":" event.lineno ")");
}
window.sendMessage = function (args) {
worker.postMessage(args);
};
async function onclick() {
sendMessage("World")
}
document.getElementById("btn").addEventListener("click", onclick, false);
worker.js
import * as p from "hello.js"
console.log("Worker Started")
onmessage = function (e) {
p.greet(e.data)
}
你好.js
export function greet(who){
alert("Hello " who)
}
工人應該輸出“工人開始”。
單擊按鈕時,UI 執行緒將向作業人員發送一條訊息,然后作業人員將呼叫該greet函式。
然而,作業人員立即出錯并通過回傳一個值worker.onerror
它在 Chromium(和基于 Chromium 的)中回傳的值是未定義的
Uncaught Error: undefined (undefined:undefined)
at Worker.worker.onerror (index.js:8:11)
我已經在具有 3 種不同作業系統的 2 臺計算機上的各種瀏覽器上對此進行了測驗,但沒有成功。
據我了解。Firefox 不支持我這樣做的方式。
Uncaught Error: SyntaxError: import declarations may only appear at top level of a module (http://localhost:8000/worker.js:1)
我在這里查看了這個答案 https://stackoverflow.com/a/33432215/19140286 但是它不允許我將檔案匯入我的作業函式。
運行 chrome
chromium --allow-file-access-from-files
并不能解決問題
示例通過本地服務器運行
python -m http.server
這是一個包含檔案 https://github.com/KivalM/web-workers的存盤庫
uj5u.com熱心網友回復:
.message沒有,.filename或的 Worker 上的此類錯誤.lineno指向網路錯誤,如果它是腳本錯誤,您將得到這些填充。
也許您的作業人員 URL 也無效,但至少您的模塊一是.
如果您不使用模塊映射,則必須附加./相對匯入 URL。
修復此問題后,您將面臨一個新錯誤,這次是腳本錯誤:
alert()只能在 Window 背景關系中訪問。您不能從 Worker 呼叫此方法。無論如何,即使在 Window 背景關系中,您也應該避免使用它,因為它對 JS 環境的影響遠非顯而易見,而且在除錯中通常不如 Console API 有用。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/478061.html
標籤:javascript html 谷歌浏览器 网络工作者
