在web worker中注册事件侦听器

时间:2016-01-06 15:01:23

标签: javascript web-worker

是否可以将Web工作者中的侦听器注册到'message''error'以外的事件? E.g。

addEventListener('keydown', function (e) {
  postMessage('test');
});

修改

根据@ T.J.Crowder的说法,这是不可能的。但是,在我的情况下,我能够用消息来模拟它,不知何故这样:

在工人中:

const handlers = {};

function registerKeyHandler(keycode, callback) {
  postMessage({
    type: 'REGISTER_KEY_HANDLER',
    keycode: keycode,
  });

  handlers[keycode] = handlers[keycode] || [];
  handlers[keycode].push(callback);
}

function onKeydown(keycode) {
  const hs = handlers[keycode] || [];
  hs.forEach(h => h());
}

self.onmessage = function(msg) {
  switch (msg.type) {
    case 'KEYDOWN':
      onKeydown(msg.payload.keycode);
      break;
  }
};

外:

worker.onmessage = function(msg) {
  switch (msg.type) {
    case 'REGISTER_KEY_HANDLER':
      window.addEventListener('keydown', function (e) {
        if (e.keyCode !== msg.keycode) {
          return;
        }
        worker.postMessage({
          type: 'KEYDOWN',
          keycode: msg.keycode,
        });
      });
      break;
  }
};

1 个答案:

答案 0 :(得分:4)

没有。 Web工作者无权访问DOM,尤其是因为

  • 允许多个线程访问DOM会打开基于浏览器的代码,使其成为一个全新的(非常棘手的)多线程错误类;只允许主UI线程更新DOM避免了
  • 某些浏览器的DOM实现无法处理来自多个线程的访问

global scope object *工作者不是一个窗口,只有web workers specification提出的最小特征,例如addEventListener(尽管奇怪的是只提到了postMessage spec),onmessageonerrorWorker属性等。

* (这是常见的,dedicated [用于SharedWorker]和shared [用于$('body').mousewheel(function(event, delta) { var self = $(this); if (delta > 0) { self.scrollLeft(self.scrollLeft()-40); } else { self.scrollLeft(self.scrollLeft()+40); } }); ]子接口,具体取决于类型工人)