在发送长 XMLHttpRequest 后导航到另一个页面

Navigate to another page after sending a long XMLHttpRequest

本文关键字：另一个 导航 XMLHttpRequest      更新时间：2023-09-26

我有一个XMLHttpRequest，它将大量数据插入MySQL数据库，需要5-10秒。下面是请求的代码：

function sendRequest(url, params, divToChange)
{
   // code for IE7+, Firefox, Chrome, Opera, Safari
   if (window.XMLHttpRequest)
   {
       var httpRequest = new XMLHttpRequest();
   }      
   else // code for IE6, IE5
   {
       var httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
   }
   // Stage 3 - open the request and prepare variables for the PHP method being  
      activated on server side//
   httpRequest.open("POST", url, true); 
   //Set request headers for POST command//
   httpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   httpRequest.setRequestHeader("Content-length", params.length);
   httpRequest.setRequestHeader("Connection", "close");
   httpRequest.onreadystatechange=function()
   {
       if(httpRequest.readyState==3)
       {     
           document.getElementById(divToChange).innerHTML='please wait';
       }
       if(httpRequest.readyState==4 && httpRequest.status==200)
       {
           document.getElementById(divToChange).innerHTML=httpRequest.responseText;
       }
   }
   httpRequest.send(params); // Stage 4 - sending the request to the server//
   //end when the server will responde we will execute the        
   "document.getElementById("txtHint").innerHTML=xmlhttp.responseText;" //
}
//Calling the request with this function//
function createEventList() 
{   
   var url = "grid-update_event_list.php";
   var params = "firstLoad=1";
   //Create the httpRequest and send it to the server//
   sendRequest(url,params, "eventsList");  
}

这是我的 html 中定义的，以获取响应文本：

<p>Events List Status: <b id='eventsList'>  </b></p>

我无法理解浏览器中的 2 种行为：

1-"请稍候"文本永远不会显示在浏览器上。当我添加alert(httpRequest.readyState)来测试正在发生的事情时，我按预期弹出了带有"3"的弹出窗口，但是我已经看到readyState==3后立即转到readyState==4。似乎它们同时发生。我确实看到了readyState==4 httpRequest.responseText;返回的文本。

2-发送请求后我无法导航到另一个页面，当前页面是响应式的(我可以更改组合框(，但是当我尝试导航到另一个链接时，浏览器会等待readyState==4，然后才继续链接到链接。我也无法理解，因为请求定义为asynchronous = true.

我做错了什么导致这两种行为吗？ 谢谢。

1.- 你需要了解 ajax 调用的就绪状态。有 5 种不同的就绪状态。有关更多信息，请查看此链接：

就绪状态

因此，您可以使用不同的 readyState(我会使用 1 或 2(在请求开始时显示对话框。否则，只需在发送 httpRequest 之前更改div。

2.- 即使 ajax 调用是异步的，它们也是顺序的。也就是说，如果您发送请求，则在收到该请求的响应之前，您无法发送另一个请求。更改页面是另一个请求/响应周期，因此在收到第一个请求的响应之前，您将无法更改页面。

希望这有帮助...

我找到了这篇文章，真的很失望。我的意思是，在 21 世纪，异步后台请求如何阻止整个浏览器进行导航？只是没有意义，现在应该有人解决这个问题。

事实证明，至少就我而言，它不是浏览器。浏览器确实对并发请求的数量有限制，通常在六个附近。但这是为了防止恶意网页的 DoS 攻击。真正的问题是PHP。

如果 PHP 使用默认的基于文件的会话系统，则会话将被锁定，直到通过页面退出或调用 session_write_close(( 关闭会话;

正在发生的事情是基本页面打开会话，执行其操作，然后关闭，一切都很好，很干净。现在，浏览器想要将某些内容 AJAX 放入页面的一部分中，并回调到提供基本页面的同一服务器，该服务器重新打开会话并将其保持打开状态，直到 AJAXing 完成。同时，页面的另一部分也希望从具有相同会话的同一服务器动态加载某些内容。PHP说："不，你必须等待。会议已经被另一个人打开了。一旦第一个 AJAX 关闭会话，第二个 AJAX 就会通过并执行其操作。现在想象一下，第一个呼叫需要 15 分钟。第二次调用和使用同一会话对同一服务器的任何链接单击都将被阻止，直到所有加载和单击以及之前的内容完成。噩梦！它使您的页面看起来像是冻结的，并且您的 AJAX 调用是按顺序执行的。好吧，它们是，但不是因为浏览器或XmlHttpRequest。

我们如何解决这个问题？简单的方法是打车就跑。如果您的页面不需要读取或写入会话中的前几行代码，则在获取数据后，调用 session_write_close((。这将解锁会话，另一个人可以使用它。我正在推测下一部分，但我认为它会起作用。如果您稍后需要写入会话，而不是将其保持打开状态，请将其关闭以便其他人可以使用它，然后保存您的会话 ID 并在稍后使用 session_start($id( 重新打开它。

更难的方法是编写自己的不锁定会话处理程序。这实际上是我所做的。我有一个基于 Cassandra 的会话处理程序，它不会锁定。不利的一面是我受到"最后获胜"并发的影响，但在我的情况下，只有我的基本页面实际写入会话，我的 AJAX 调用不会写入任何内容，所以这不是问题。如果你没有锤子，就无法破坏你的数据。

希望这有所帮助，因为虽然最初的答案有助于解决我的问题，但这完全是对实际情况的误解。异步 XmlHttpRequests 不是顺序的。

相关文章：