TypeError:Window.postMessage的参数不足

TypeError: Not enough arguments to Window.postMessage

本文关键字：参数 postMessage Window TypeError      更新时间：2023-09-26

我正在了解web工作者。我正在使用以下教程

https://developer.mozilla.org/en/docs/Web/Guide/Performance/Using_web_workers

到目前为止，它是有效的。我有以下代码

var worker = new Worker('thing.js');
worker.addEventListener('message', function(e) {
    alert("Worker said: " +  e.data);
}, false);
worker.postMessage("Test me");

在我的thing.js文件中

self.addEventListener('message', function(e) {
   self.postMessage(e.data);
}, false);

以上操作很好。

然而，我需要将thing.js中的一条消息传递回我的主js文件，以演示它传递回进度更新。

同样，教程显示我可以做到这一点，所以我有以下更新的代码

var worker = new Worker('thing.js');
worker.addEventListener('message', function(e) {
    alert("Worker said: " +  e.data);
}, false);
worker.postMessage("Test me");

在我的东西.js

self.addEventListener('message', function(e) {
  self.postMessage(e.data);
}, false);
function DoThisThing() {
    postMessage("I should ALSO be working but I am not.");
}

此操作失败，并显示错误消息（在FireBug中）：

TypeError：Window.postMessage.的参数不足

我看不出我做错了什么。

拥有触发该问题的完整源代码会很方便，但我敢打赌，问题在于，除了实例化worker之外，您的代码还通过脚本标记包含worker文件。类似于：

<script type="text/javascript" src="thing.js"></script>

所以基本上你所拥有的是：

thing.js（工人）

   self.addEventListener('message', function(e) {
      self.postMessage(e.data);
    }, false);
    function DoThisThing() {
        postMessage("I should ALSO be working but I am not.");
    }
    DoThisThing();

我假设您正在调用DoThisThing（），因为否则您将不会得到"TypeError: Not enough arguments to Window.postMessage"错误。

如果您按原样运行代码，它是有效的，但您也会看到错误。

TypeError: Not enough arguments to Window.postMessage.
Worker said: I should ALSO be working but I am not.  
Worker said: Test me

那么是什么触发了TypeError：没有足够的参数。。。？如果您从script标记获取文件，那么该函数实际上会执行两次。第一次通话时，出现错误。

当thing.js由script标记获取来源时，DoThisThing()将被执行。这是第一个电话。DoThisThing()调用postmessage（与self.postmessage相同）。但是这个调用被解析为window.postmessage。此方法需要第二个参数（targetOrigin）。

然而，当执行工作者时，对postmessage（与self.postmessage相同）的调用将解析为DedicatedWorkerGlobalScope.postmessage。此方法不需要第二个参数。

当您在postmessage中添加第二个参数时，您解决了第一个调用的问题，但没有解决第二个调用。因此，您得到了一个新错误："TypeError：DedicatedWorkerGlobalScope.postMessage的参数2无法转换为序列"。

总之，有两种类型的postmessage，一种属于window对象，另一种属于DedicatedWorkerGlobalScope对象。对postmessage的简单调用通常由DedicatedWorkerGlobalScope对象解析。这个电话很方便员工与家长沟通。CCD_ 16需要指定CCD_ 17的第二参数。此呼叫便于跨来源通信。

在您的案例中，问题的可能原因是从script标记中获取worker JavaScript文件。这导致postmessage被window解析，这需要第二个参数。

相关文章：