Você precisa de uma fila: sempre que o sendToServer
for chamado, coloque os dados na fila em vez de enviá-los direto. Ao final, das duas uma:
- Se o sistema estiver num estado que permita que as mensagens sejam enviadas, envie-as de uma vez (só deve ter uma);
- Caso contrário não envie.
Quando o sistema mudar do estado "bloqueado" pro estado "disponível", envie tudo o que estiver na fila (pra não ter que esperar a próxima chamada de sendToServer
.
var connection = new WebSocket('ws://127.0.0.1:2333');
var fila = [];
function esvaziaFila() {
while ( fila.length > 0 ) {
if ( !podeProcessar )
return;
var proximo = fila.shift();
if ( proximo.envio )
connection.send(proximo.dados);
if ( proximo.recebimento )
processar(proximo.evento);
}
}
var podeProcessar = false;
connection.onopen = function () { // abriu a conexão com o servidor
document.body.innerHTML += "<pre>Abriu a conexão</pre>";
podeProcessar = true;
};
connection.onerror = function (error) { // ocorreu um erro na comunicação
};
connection.onmessage = function (e) { // recebe do servidor
rec("cliente", e);
fila.push({ recebimento:true, evento:e });
esvaziaFila();
};
function processar(evento) { // recebe mensagens do servidor
document.body.innerHTML += "<pre>Cliente vai processar " + JSON.stringify(evento) + "; não faz mais nada até estar pronto!";
podeProcessar = false;
tarefaDemorada(evento);
}
function sendToServer(data) { // envia mensagens para o servidor
fila.push({envio:true, dados:data});
esvaziaFila();
}
/********** Mockups para testar ***************/
function rec(classe, dados) {
document.body.innerHTML += "<pre class='" + classe + "'>" + classe + " recebeu: " + JSON.stringify(dados) + "</pre>";
}
function env(classe, dados) {
document.body.innerHTML += "<pre class='" + classe + "'>" + classe + " enviou: " + JSON.stringify(dados) + "</pre>";
}
function WebSocket() {
this.send = function(data) {
rec("servidor", data);
}
// Manda algumas mensagens no futuro
var self = this;
setTimeout(function() { self.onopen() }, 500);
setTimeout(function() { env("servidor","A"); self.onmessage("A") }, 2000);
setTimeout(function() { env("servidor","B"); self.onmessage("B") }, 4000);
setTimeout(function() { env("servidor","C"); self.onmessage("C") }, 6000);
}
setTimeout(function() { env("cliente","D"); sendToServer("D"); }, 8000);
setTimeout(function() { env("cliente","E"); sendToServer("E"); }, 10000);
function tarefaDemorada(evento) {
setTimeout(function() {
document.body.innerHTML += "<pre>Terminou de processar " + JSON.stringify(evento) + "; pode processar o resto.";
podeProcessar = true;
esvaziaFila();
}, evento == "B" ? 5500 : 1250);
}
.servidor {
color: blue;
}
.cliente {
color: red;
}
Alternativa: grafo de dependências
Se você possui um fluxo complexo de envio/recebimento, uma maneira de gerenciar essa complexidade é criando um grafo de dependências entre suas mensagens, tanto de entrada quanto de saída. Sugiro isso - e não uma ordem total - pois é complicado dizer que "o evento A ocorreu antes do evento B" quando A se originou numa máquina (ex.: o cliente) e B em outra (ex.: o servidor)[1].
Um exemplo que combina a técnica da fila com um grafo de dependências seria o seguinte:
var fila = [];
function processaFila() {
while ( fila.length > 0 ) {
var proximo = fila[fila.length-1];
if ( !proximo.pronto ) // Se está aguardando outro processamento
break; // Não processa mais nada
fila.pop();
if ( proximo.envio ) // Se está pronta pra ser enviada
connection.send(proximo.dados);
if ( proximo.recebimento ) // Se foi recebida e tem de ser processada
proximo.processar(proximo.evento);
}
}
function incluiNaFila(job) {
var i = fila.length;
while ( i > 0 ) {
// Se o próximo da fila precisa ser executado depois da tarefa atual
if ( dependeDe(fila[i-1], job) )
break; // Coloca a atual no começo da fila
// Senão, coloca a atual depois do primeiro da fila
fila[i] = fila[i-1];
i--; // Repete a lógica pro segundo da fila, etc
}
fila[i] = job;
}
connection.onmessage = function (e) {
incluiNaFila({
recebimento:true, pronto:true,
evento:e,
processar:function(e) { ... }, // Função que processa a entrada
... // outros campos que determinam a dependência
});
processaFila();
}
function sendToServer(data) {
incluiNaFila({
envio: true, pronto:true,
dados: data,
... // Outros campos que determinam a dependência
});
processarFila();
}
function dependeDe(tarefaA, tarefaB) {
/* Aqui entra sua lógica específica.
Ela deve retornar false se a tarefa B pode ser executada depois
de A (B é uma tarefa mais nova que A), ou true se A precisa
esperar B estar pronta pra executar.
*/
}
Após uma rápida leitura no seu exemplo no pastebin (nos comentários), eu sugeriria algo assim como ponto de partida:
var sequencial = 0; // Cada mensagem de iniciativa do servidor ou do cliente
// recebe um id sequencial; mensagens que são respostas
// a outra mensagem recebem o mesmo id da mensagem original.
connection.onmessage = function(e) {
var id = sequencial++;
incluiNaFila({
recebimento:true,
evento:e,
processar:function(e) {
var aguradando = {
recebimento:true, processar:function(){},
pronto:false, id:id
}
incluiNaFila(aguardando);
funcaoquetrataamensagem(.......).then(function() {
aguardando.pronto = true;
processaFila();
});
},
id:id
});
processaFila();
}
// Envia uma mensagem, sem impor nenhuma ordem específica (iniciativa do cliente)
function sendToServer(data) {
incluiNaFila({
envio: true, pronto:true,
dados: data,
id:sequencial++
});
processarFila();
}
// Envia uma mensagem como resposta a uma mensagem recebida
function respondToServer(idMensagemOriginal, data) {
incluiNaFila({
envio: true, pronto:true,
dados: data,
id:idMensagemOriginal+1 // Garante que só será enviada quando a
// mensagem original tiver sido processada
});
processarFila();
}
function dependeDe(a, b) {
return ( a.id > b.id );
}
Nesse exemplo as mensagens recebidas e as mensagens enviadas por iniciativa do cliente serão processadas na ordem (fila), enquanto as mensagens que são resposta a uma outra mensagem serão processadas só depois que a mensagem original tiver sido totalmente processada. Qualquer mensagem que precise "fazer mais coisas" antes de terminar seu processamento bloqueia toda a fila - ao inserir na mesma uma nova tarefa aguardando
com o mesmo id, e consequentemente a mesma prioridade, da mensagem original.
[1]: Há várias tentativas de solução pra esse problema, mas nenhuma perfeita. Escolher um lado da comunicação para ser autoritativo pode causar starvation no outro; A técnica Operational Tranform é promisora, mas não se aplica a todos os casos; Em alguns cenários (ex.: a rede BitCoin), o proof of work pode ser usado para reduzir o problema, mas não o elimina totalmente. Etc.
onmessage
, e só quando algo em especial acontecer (uma mensagem de "fim das entradas" por exemplo) é que osendToServer
pode executar. É algo desse tipo?