如何使用ajax即时获取数据?

发布于 2024-12-02 13:39:07 字数 1508 浏览 1 评论 0原文

我试图用ajax立即获取数据,但我做不到。问题是,当我发出请求时,响应即将结束 php 进程。我想在每个 echo 命令之后获取数据。这是一个简单的例子。有两个文件,主 html 文件(包括 javascript)和 php 文件。

当我点击开始查询按钮时, try.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Get Data</title>
<script type="text/javascript">
function makeObject() {
    var newObject;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        newObject = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else {
        newObject = new XMLHttpRequest();
    }
    if (newObject.overrideMimeType) {
        newObject.overrideMimeType('text/xml; charset=UTF-8;');
    }   
    return newObject;
}

var newOne=makeObject();

function getData()
{
    newOne.open('get','process.php',true);
    newOne.onreadystatechange=function(){
        if (newOne.readyState==4)
        {
            var box=document.getElementById("queryResult");
            box.innerHTML=newOne.responseText;
        }
    }
    newOne.send(null);
}
</script>
</head>    
<body>
<input type="button" id="doit" value="Start Query" onclick="getData();" />
<div id="queryResult"></div>
</body>
</html>

和process.php

<?php
echo "1";
sleep(1);
echo "2";
sleep(1);
echo "3";
sleep(1);
echo "4";
sleep(1);
echo "5";
?>

等待4秒,然后同时写入12345。我想写入 1 并等待 1 秒,然后写入 2 并等待 1 秒,然后写入 3 等等。我该怎么做?抱歉我的英语不好,谢谢你的回答:)

I am trying to get data instantly with ajax, but I couldn't. The problem is, when I make a request, response is coming end of the php process. I want to get data after every echo command. So here is the simple example. There is two files, main html file (included javascript) and php file.

try.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Get Data</title>
<script type="text/javascript">
function makeObject() {
    var newObject;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        newObject = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else {
        newObject = new XMLHttpRequest();
    }
    if (newObject.overrideMimeType) {
        newObject.overrideMimeType('text/xml; charset=UTF-8;');
    }   
    return newObject;
}

var newOne=makeObject();

function getData()
{
    newOne.open('get','process.php',true);
    newOne.onreadystatechange=function(){
        if (newOne.readyState==4)
        {
            var box=document.getElementById("queryResult");
            box.innerHTML=newOne.responseText;
        }
    }
    newOne.send(null);
}
</script>
</head>    
<body>
<input type="button" id="doit" value="Start Query" onclick="getData();" />
<div id="queryResult"></div>
</body>
</html>

and process.php

<?php
echo "1";
sleep(1);
echo "2";
sleep(1);
echo "3";
sleep(1);
echo "4";
sleep(1);
echo "5";
?>

when I click the Start Query button, it is waiting 4 seconds and then write 12345 at the same time. I want to write 1 and wait 1 sec then write 2 and wait 1 sec then write 3 etc. How can I do that? Sorry for my English, thanks for the answers :)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

蓬勃野心 2024-12-09 13:39:07

ajax 等待响应,因此您正在等待最终响应。你必须做单独的请求。可能根据前一个请求的结果设置后续请求。

ajax waits for a response, so you are making the final response wait. you would have to do seperate requests. Possibly set subsequent request of dependant upon the result of the previous one(s).

街角卖回忆 2024-12-09 13:39:07

您需要使用 html5 Web 套接字。使用标准 ajax 在请求完成之前不会返回。

You need to use an html5 web socket. Using standard ajax will not return until the request has completed.

流绪微梦 2024-12-09 13:39:07

您的代码完全按照您的要求进行。 ajax 响应是在收到最后一个字节时在客户端提供给您的,而不是在收到时提供的。

如果您希望从服务器端出现在客户端,那么客户端必须轮询并且服务器保持某种状态来响应,而不是像服务器尝试发送流响应那样。新的 HTML5 客户端套接字可能会帮助您,而不是轮询服务器可以调用客户端

your code is doing exactly what you ask. The ajax response is supplied to you on the client side when the last byte is received not as it is received.

if you are after progress from the server side to appear on the client side then the client must poll and the server maintain a some state to respond, not as you have it with the server trying to send a stream response. The new HTML5 client side sockets may help you here where rather than polling the client can be called by the server

不爱素颜 2024-12-09 13:39:07

如果我理解你的问题,你将需要进行 4 个 ajax 方法调用。由于您期望每次调用都有不同的值,因此您需要将状态保存在某处(在客户端或服务器上),以便您知道您正在进行哪个调用。如果示例中的暂停是预期程序的一部分(而不仅仅是为了示例),那么在客户端 Javascript 中可能会更好。

If I understand your question you will need to make 4 ajax method calls. Since you are expecting different values from each call you need to have the state saved somewhere (on client or server) so that you know which call you are on. If the pauses in your sample are part of your intended program (and not just for the sake of the sample) then it would probably be better in your client-side Javascript.

莫多说 2024-12-09 13:39:07

服务器缓冲其输出 - 发送单个字符会极大地浪费网络资源。要强制 PHP 和网络服务器刷新其缓冲区,您至少需要:

echo "1";
flush();
ob_flush();
echo "2";
etc...

Servers buffer their output - sending a single character is extraordinarly wasteful of network resources. To force PHP and the webserver to flush their buffers, you need at least:

echo "1";
flush();
ob_flush();
echo "2";
etc...
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文