是进度条可能与PHP和javascript使用ajax

is progress bar possible with php and javascript using ajax

本文关键字:PHP javascript 使用 ajax      更新时间:2023-09-26

我想知道如何使进度条像gmail。

I tried

<script src="jquery.js"></script>
<script>
$(function (){
    $.ajax({
        url: 'index.php',
        success: function(data) {
            $('#bar').html(data);
        }
    });
})
</script>
<div id="bar"></div>

index.php

[EDIT]:通过sleep(),我只是想模拟多线程程序的连续输出流,这在php中是不支持的。

<?php
for($i=0; $i<=10; $i++)
{
    sleep(1);
    echo "$i";
}

似乎输出立即回显,所以我立即得到结果012345678910

also I tried

setInterval(function (){
        $.ajax({
            url: 'index.php',
            success: function(data) {
                $('#bar').html(data);
            }
        });
    }, 1000);
相反,我在维护'progress'的值时遇到了麻烦,所以我使用了
<?php
session_start();
if(isset($_SESSION['value'])){
    if($_SESSION['value'] >= 10)
    {
        unset($_SESSION['value']);
    }
    else
    {
        $_SESSION['value']++;
    }
}
else
{
    $_SESSION['value'] = 0;
}
echo $_SESSION['value'];

作为php的一部分。但似乎,我在连续的间隔上调用ajax函数。

我的问题是,

  1. 谷歌如何使用进度条,而登录gmail。他们是否像我在第一个例子中尝试的那样获得连续的'stream'数据,或者在某些url上发送(定期)请求(尽管不是通过ajax ..通过JSONP或其他方式)更新页面,如second ?

  2. 我可以做同样的php,即使不是php,我可以使用javascript和其他服务器端脚本语言支持多线程吗?

我不确定Gmail到底为进度条做了什么,但是您可以在PHP中实现类似的功能,尽管它可能有点棘手。

首先,解释为什么你的例子不起作用:

如果你像第一个例子一样回显并睡觉,它将永远不会工作。Ajax执行一个完整的请求——也就是说,如果响应没有完成,它将等待。当你循环并休眠时,直到PHP脚本完成执行,请求才会"关闭"。

如果像在另一个示例中那样使用session,问题就变成了会话存储。存储通常在脚本执行期间被锁定,并且它不会更新自己以允许您想要的进度检查类型。

你可以做的是手动将进度写入文件(或数据库)。例如:

file_put_contents('progress.txt', 1);

然后,让另一个脚本读取文件并输出内容。

这应该可以工作,因为file_put_contents打开、写入和关闭文件。

使用PHP以外的其他语言会更容易。多线程可能会使它更容易,但不是必需的。但是,拥有一个连续运行的进程会使它更简单(PHP只在您的请求期间运行一个进程,然后退出)

每隔一段时间运行jquery代码,然后使用PHP打印进度百分比并绘制条形图。

就是像

这样的东西
<script>
function bar()
{
 var v=getProgress(...);
 setTimeout("bar()",1000);
 drawBar();
}
function drawBar(l)
{
 //set div's length to l
}
</script>

编辑2

<?php
/* get the request and calculate the job completion percentage and echo it !  */
?>

我认为Gmail在加载所有资源(如JS文件)时显示进度。有不同的方法可以做到这一点:你可以动态地包含所有的JS资源,或者你可以让所有包含的JS文件报告他们已经加载。


要使PHP输出部分输出,使用如下命令:

ob.php

<?php
ob_start();
for ($i = 0; $i < 100; $i++) {
    echo "{$i}<br />";
    ob_flush();
    flush();
    usleep(100000);
}

. htaccess

php_value output_buffering "0"

这个线程和这个链接帮助我找到了同样问题的解决方案,所以我提供了它的记录:

test.php:

<?php 
  for($i=0; $i<100; $i++)
  {   usleep(100000); //100ms
      echo 'A'; ob_flush(); flush();
  }
?>

test.html:

<body>
   <button onclick='call()'>call</button>
   <div id='progress'>...</div>
   <script>
      function fprogress(e) 
      { document.getElementById('progress').innerHTML ='progress: '+e.loaded +'%'; }
      function call()
      {  var req = new XMLHttpRequest();  
         req.addEventListener("progress", fprogress, false);
         req.open('GET', 'test.php', true);  req.send(null);
      }
   </script>
</body>

…所以test.php可以是任何JOB。并在此过程中使用闪烁缓冲区回声100个字符(字节)。

在我看来,你可以把你的登录过程分成几个部分和检查。

每个部分检查完成发送响应到您的进度条和进度条的宽度将增加这样的模式。之后,进度条将向您的登录过程发送下一个请求,直到您无法获得100%的登录和重定向。