AJAX HTTP GETリクエストは、仕事に2度発砲する必要があります。

Question

私はajaxチャットプログラムを書いています。私は奇妙なバグを抱えています。私はそれを正しく処理するためにGETリクエストを2度呼び出す必要があります。最初に起動すると、サーバにうまく応答するように見えますが、2度目に呼び出されるまでonreadystatechange [getChatText（）]に割り当てられた関数はアクティブになりません。それが何を引き起こしているのか分からず、皆さんが助けてくれると思いました。

コードは以下のとおりです。

Javascriptを：

var recieveReq = getXmlHttpRequestObject(); 
var sendReq = getXmlHttpRequestObject(); 
var lastMessage = "NULL"; 
var mTimer; 

//Create XMLHTTP Object 
function getXmlHttpRequestObject() { 
    return new XMLHttpRequest(); 
}; 

//GET & POST creation 
function getChatText() { 
    if (recieveReq.readyState == 4 || recieveReq.readyState == 0) { 
     recieveReq.onreadystatechange = handleRecieveChat(); 
     recieveReq.open("GET", 'chat.php?chat=1', true); 
     recieveReq.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
     recieveReq.send(null); 
    }; 
}; 
function sendChatText() { 
    if(document.getElementById('text_message').value == '') { 
     alert("You have not entered a message"); 
     return; 
    }; 
    if (sendReq.readyState == 4 || sendReq.readyState == 0) { 
     sendReq.onreadystatechange = handleSendChat(); 
     sendReq.open("POST", 'chat.php?send=1', true); 
     sendReq.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
     var param = '&message=' + document.getElementById('text_message').value; 
     sendReq.send(param); 
     document.getElementById('text_message').value = ''; 
    }; 
}; 

//Handle Send & Receive 
function handleRecieveChat() { 
    if (recieveReq.readyState == 4 && recieveReq.status == 200) { 
     var chatDiv = document.getElementById('div_chat'); 
     var tempResponse = recieveReq.responseText; 
     var response = tempResponse.replace(/\\\//g,"/"); 
     if (response != lastMessage) { 
      chatDiv.innerHTML = response; 
     }; 
     chatDiv.scrollTop = chatDiv.scrollHeight; 
     lastMessage = response; 
     mTimer = setTimeout('getChatText();', 5000); 
    }; 
}; 
function handleSendChat() { 
    clearInterval(mTimer); 
    if (sendReq.readyState == 4 || sendReq.readyState == 0) { 
     getChatText(); 
    } 
}; 

function resetChat() {}; //Empty for now 

document.onload = getChatText(); 

PHP：

<?php 
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); 
    header("Last-Modified: " . gmdate("D, d M Y H:i:s") . "GMT"); 
    header("Cache-Control: no-cache, must-revalidate"); 
    header("Pragma: no-cache"); 
    header("Content-Type: text/plain; charset=utf-8"); 

    $connect = mysqli_connect("localhost", "user", "password", "database"); 

    if (!$connect) { 
     die('Could not connect: ' . mysqli_connect_errno($connect)); 
    } 

    if(isset($_GET["chat"])) { 
     $sql = "SELECT * FROM message ORDER BY message_id;"; 
     $result = mysqli_query($connect, $sql); 
     $row = mysqli_fetch_array($result); 
     if ($result->num_rows > 0) { 
      while($row = $result->fetch_assoc()) { 
       $time = substr($row['post_time'], 0, 5); 
       echo "<span style=color:".$row['user_color'].">".$row['user_name']."</span> (".$time."): ".$row['message']."<br>"; 
      } 
     } 
     $connect->close(); 
    } 

    if(isset($_POST['message']) && $_POST['message'] != '') { 
     $sql = "INSERT INTO message (chat_id, user_id, user_name, message, post_time, user_color) VALUES (1, 3, 'Riley', '".$_POST['message']."', NOW(), '#29D410');"; //Couple are default for testing purposes 
     $result = mysqli_query($connect, $sql); 
     echo $sql; 
     $connect->close(); 
    } 
?> 

PS： SQL入力衛生または私はまだにもらっていない他の事を指摘して気にしないでください。このhttpリクエスト処理バグにちょうど答えてください。ありがとう。

Answer 1

onreadystatechangeはイベントハンドラであり、関数を参照する必要があります。あなたのコードでは、handleReceiveChatとhandleSendChatという結果を参照していますが、どちらも返さないので、undefinedです。以下に変更してみてください：コールが二度目に取り組んでいるかのように

receiveReq.onreadystatechange = handleReceiveChat

sendReq.onreadystatechange = handleSendChat;

しかし、コードが二通り（最初の呼び出しからの応答を使用することになります、表示されます。応答はまだ完了していない）。