Ajax response repeats that of another request and the page is not even the same

Question

The scenario is this: I have an ajax that is waiting for a response from the Java server on port 2336 like Hotmail, and as soon as it is updated, Java returns the response and closes the open HTTP request. Then javascript picks up the reply and executes whatever it is and opens another request again to wait again for new updates. When I have to send something to the server I send it to PHP to port 80, usually in another request, and PHP returns the answer whether it was successful or not. So far everything is OK, the problem is that if the request for synchronization with Java on port 2336 is open and I send something to port 80 when some notice of autalization of Java comes the answer is the same as that of PHP. Then, if I haven’t sent anything to PHP again, it displays the Java response normally.

Does anyone have any idea what might be going on?

The duties are as follows::

function sincronizar() {
    ajax("http://" + window.location.hostname + ":2336", "POST", "Id=Anderson", executaResposta, "");
}

function controle() {
    ajax("php/controle.php", "POST", "Comando=ID", "containerFiltragemEntregas", "");
}

function ajax(endereco, metodo, dados, alvo, distracao) {
    xmlhttp = new XMLHttpRequest();
    if (distracao != "") {
        centralizaElemento(distracao);
        mostraElemento(distracao);
    }
    if (typeof(alvo) == "string") {
        elemento(alvo).innerHTML = "";
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var retorno = xmlhttp.responseText.trim();
            mostraAlerta(retorno + "\r\n\r\n" + metodo);
            if (typeof(alvo) == "function") {
                alvo(retorno);
                } else {
                    elemento(alvo).innerHTML = retorno;
            }
            if (distracao != "") {
                centralizaElemento(distracao);
                escondeElemento(distracao, 2000);
            }
        }
    }

    if (metodo == "GET") {
        xmlhttp.open("GET", endereco + "?" + dados, true);
        xmlhttp.send();
    } else if (metodo == "POST") {
        xmlhttp.open("POST", endereco, true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send(dados);
    }
}

function executaResposta(resposta) {
    var respostaSeparada = resposta.split("|");
    var comandoSeparado;
    if (respostaSeparada[0] == "01") {
        if (respostaSeparada[1] == "01") {
            comandoSeparado = respostaSeparada[3].split("&");
            if (respostaSeparada[2] == "05") {
                alertaEntrega("containerEntrega" + comandoSeparado[0]);
            } else if (respostaSeparada[2] == "04") {
                escondeElemento("containerEntrega" + comandoSeparado[0]);
            } else {
                normalizaEntrega("containerEntrega" + comandoSeparado[0]);
            }
            elemento("entregaSituacao" + comandoSeparado[0]).innerHTML = comandoSeparado[1];
        }
     }
    sincronizar();
}

Answer 1

The problem is that you use a single Xmlhttprequest object. I may be wrong, but I think to fix just make your variable xmlhttp local (for she is a implicit global):

function ajax(endereco, metodo, dados, alvo, distracao) {
    var xmlhttp = new XMLHttpRequest();
    // ... O resto fica igual
}

So every call of ajax will create a variable xmlhttp independent, and the requisitions won’t interfere with each other.