O método WebWorker.postMessage
não retorna nada ("Void"), de modo que ele não pode ser usado diretamente dessa forma. Se você quiser usar promessas, terá que implementar isso você mesmo.
Uma forma de fazer isso é associando a cada mensagem que você envia pro web worker um ID único, e ao final de toda execução o worker envia o resultado também acompanhado desse ID único. Então é só chamar o método resolve
ou reject
associado a esse ID, conforme a tarefa tenha tido sucesso ou não (isso tem de ser indicado pelo próprio worker, naturalmente).
Código da página principal:
// Simulação de um webWorker (para testes)
var WR = {
postMessage: function(event) {
event = { data:event };
var data = event.data;
// Faz alguma coisa com data.dados
setTimeout(function() {
if ( Math.random() < 0.7 )
WR.onmessage({ data:{ ok:data.msgid, dados:"dados " + data.msgid }});
else
WR.onmessage({ data:{ falhou:data.msgid, dados:"outrosdados " + data.msgid }});
}, Math.floor(Math.random() * 3000));
}
}
// Implementação
var msgseq = 1;
var callbacks = {};
function postWithPromise(WR, dados) {
return new Promise(function(resolve, reject) {
var id = msgseq++;
WR.postMessage({ msgid: id, dados:dados });
callbacks[id] = { resolve:resolve, reject:reject };
});
}
WR.onmessage = function(event) {
var data = event.data;
if ( data.ok ) {
callbacks[data.ok].resolve(data.dados);
delete callbacks[data.ok];
}
if ( data.falhou ) {
callbacks[data.falhou].reject(data.dados);
delete callbacks[data.falhou];
}
}
// Exemplo de uso
document.querySelector("button").onclick = function() {
postWithPromise(WR, "dados").then(function(dados) {
alert("OK (" + dados + ")");
}, function(dados) {
alert("Falhou (" + dados + ")");
});
};
<button>Testar</button>
Código do worker:
self.onmessage = function(event) {
var data = event.data;
// Faz alguma coisa com data.dados
if ( Math.random() < 0.7 )
self.postMessage({ ok:data.msgid, dados:"dados " + data.msgid });
else
self.postMessage({ falhou:data.msgid, dados:"outrosdados " + data.msgid });
}
Para um exemplo funcional, usar esse [fragmento de] HTML "teste.html" e esse código JavaScript "worker.js". Nota: é preciso um webserver para o exemplo funcionar, não se pode carregar um worker a partir do file:///
(no Chrome, pelo menos).