使用PHP和AJAX不刷新页面的新事件通知

•浏览 1

New event notification without refreshing a page using PHP and AJAX

每次将新事件添加到我的数据库时，我都会向我的用户显示通知。我的首页上有一个小图标，还有一个红色方块来显示添加的新事件的数量。现在我只想知道在不刷新页面的情况下显示新事件的最佳方法是什么。

关于jquery：使用PHP和AJAX不刷新页面的新事件通知

这是我的代码

<li>

<i class="fa fa-warning fa-2x">

  <?php if ($totalRows_event > 0) { ?>

    <span class="label label-danger blink"><?php echo $totalRows_event ?></span>

  <?php } ?>



</li>
function testAjax() {

  var result ="";

  $.ajax({

    url:"data.php",

    async: false,

    success: function (data, textStatus) {

      $("#preview").html(data);

    },

    error: function () {

      alert('Not OKay');

    }

  });

  return result;

}

<li>



 <i class="fa fa-warning fa-2x">

 <span class="label label-danger blink" id="preview"></span>



</li>

public function index()

  {

    if (!$_GET['timed']) exit();

    if (!$_GET['uid']) exit();

    date_default_timezone_set("PRC");

    set_time_limit(0);

    $uid = $_GET['uid'];

    while (true) {

      sleep(3); 

      $lastReadTime = M('readtime')->where(array('uid'=>$uid))->field('lasttime')->select();

      $result = M('message')->where(array('send_time'=>array('gt',$lastReadTime),'touid'=>$uid))->count();

      if($result){

        $data = array(

          'message' => $result,

        );

        echo json_encode($data);

        exit();

      } else { 

        usleep(1000);

        exit();

        //return;

      }

    }

    session_write_close();

  }

var cometURL ="{:U(GROUP_NAME.'/Comet/index')}"

  $(function () {

    (function longPolling() {

      //alert(Date.parse(new Date())/1000);

      $.ajax({

        url: cometURL,

        data: {"timed": Date.parse(new Date())/1000,"uid":$("#uid-hidden").val()},

        dataType:"json",

        timeout: 5000,

        error: function (XMLHttpRequest, textStatus, errorThrown) {

          if (textStatus =="timeout") { 

            longPolling();

          } else { 

            longPolling();

          }

        },

        success: function (data, textStatus) {

          if(data.message != 0){

          $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

          $("#messagenum").html('message('+data.message+')');

          }

          if(data.image != 0){

            $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

            $("#imagenum").html('New Image('+data.image+')');

          }

          if (textStatus =="success") { 

            longPolling();

          }

        }

      });

    })();

  });

我的PHP查询基本上是事件总数>0的时候，显示一个<span>和里面的总数，但是这只在页面刷新或者加载的时候显示。

我正在查看一个类似于下面的 AJAX 请求，它将 PHP 查询结果显示到内部 html 中。

<li>

<i class="fa fa-warning fa-2x">

  <?php if ($totalRows_event > 0) { ?>

    <span class="label label-danger blink"><?php echo $totalRows_event ?></span>

  <?php } ?>



</li>
function testAjax() {

  var result ="";

  $.ajax({

    url:"data.php",

    async: false,

    success: function (data, textStatus) {

      $("#preview").html(data);

    },

    error: function () {

      alert('Not OKay');

    }

  });

  return result;

}

<li>



 <i class="fa fa-warning fa-2x">

 <span class="label label-danger blink" id="preview"></span>



</li>

public function index()

  {

    if (!$_GET['timed']) exit();

    if (!$_GET['uid']) exit();

    date_default_timezone_set("PRC");

    set_time_limit(0);

    $uid = $_GET['uid'];

    while (true) {

      sleep(3); 

      $lastReadTime = M('readtime')->where(array('uid'=>$uid))->field('lasttime')->select();

      $result = M('message')->where(array('send_time'=>array('gt',$lastReadTime),'touid'=>$uid))->count();

      if($result){

        $data = array(

          'message' => $result,

        );

        echo json_encode($data);

        exit();

      } else { 

        usleep(1000);

        exit();

        //return;

      }

    }

    session_write_close();

  }

var cometURL ="{:U(GROUP_NAME.'/Comet/index')}"

  $(function () {

    (function longPolling() {

      //alert(Date.parse(new Date())/1000);

      $.ajax({

        url: cometURL,

        data: {"timed": Date.parse(new Date())/1000,"uid":$("#uid-hidden").val()},

        dataType:"json",

        timeout: 5000,

        error: function (XMLHttpRequest, textStatus, errorThrown) {

          if (textStatus =="timeout") { 

            longPolling();

          } else { 

            longPolling();

          }

        },

        success: function (data, textStatus) {

          if(data.message != 0){

          $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

          $("#messagenum").html('message('+data.message+')');

          }

          if(data.image != 0){

            $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

            $("#imagenum").html('New Image('+data.image+')');

          }

          if (textStatus =="success") { 

            longPolling();

          }

        }

      });

    })();

  });
<li>

<i class="fa fa-warning fa-2x">

  <?php if ($totalRows_event > 0) { ?>

    <span class="label label-danger blink"><?php echo $totalRows_event ?></span>

  <?php } ?>



</li>
function testAjax() {

  var result ="";

  $.ajax({

    url:"data.php",

    async: false,

    success: function (data, textStatus) {

      $("#preview").html(data);

    },

    error: function () {

      alert('Not OKay');

    }

  });

  return result;

}

<li>



 <i class="fa fa-warning fa-2x">

 <span class="label label-danger blink" id="preview"></span>



</li>

public function index()

  {

    if (!$_GET['timed']) exit();

    if (!$_GET['uid']) exit();

    date_default_timezone_set("PRC");

    set_time_limit(0);

    $uid = $_GET['uid'];

    while (true) {

      sleep(3); 

      $lastReadTime = M('readtime')->where(array('uid'=>$uid))->field('lasttime')->select();

      $result = M('message')->where(array('send_time'=>array('gt',$lastReadTime),'touid'=>$uid))->count();

      if($result){

        $data = array(

          'message' => $result,

        );

        echo json_encode($data);

        exit();

      } else { 

        usleep(1000);

        exit();

        //return;

      }

    }

    session_write_close();

  }

var cometURL ="{:U(GROUP_NAME.'/Comet/index')}"

  $(function () {

    (function longPolling() {

      //alert(Date.parse(new Date())/1000);

      $.ajax({

        url: cometURL,

        data: {"timed": Date.parse(new Date())/1000,"uid":$("#uid-hidden").val()},

        dataType:"json",

        timeout: 5000,

        error: function (XMLHttpRequest, textStatus, errorThrown) {

          if (textStatus =="timeout") { 

            longPolling();

          } else { 

            longPolling();

          }

        },

        success: function (data, textStatus) {

          if(data.message != 0){

          $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

          $("#messagenum").html('message('+data.message+')');

          }

          if(data.image != 0){

            $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

            $("#imagenum").html('New Image('+data.image+')');

          }

          if (textStatus =="success") { 

            longPolling();

          }

        }

      });

    })();

  });

但是，每次将新事件添加到我的数据库时，我如何调用该函数而不刷新或加载页面？我认为使用设置的时间间隔或延迟会因为频繁的服务器查询而减慢我的页面，所以我正在寻找其他选项。

php:

<li>

<i class="fa fa-warning fa-2x">

  <?php if ($totalRows_event > 0) { ?>

    <span class="label label-danger blink"><?php echo $totalRows_event ?></span>

  <?php } ?>



</li>
function testAjax() {

  var result ="";

  $.ajax({

    url:"data.php",

    async: false,

    success: function (data, textStatus) {

      $("#preview").html(data);

    },

    error: function () {

      alert('Not OKay');

    }

  });

  return result;

}

<li>



 <i class="fa fa-warning fa-2x">

 <span class="label label-danger blink" id="preview"></span>



</li>

public function index()

  {

    if (!$_GET['timed']) exit();

    if (!$_GET['uid']) exit();

    date_default_timezone_set("PRC");

    set_time_limit(0);

    $uid = $_GET['uid'];

    while (true) {

      sleep(3); 

      $lastReadTime = M('readtime')->where(array('uid'=>$uid))->field('lasttime')->select();

      $result = M('message')->where(array('send_time'=>array('gt',$lastReadTime),'touid'=>$uid))->count();

      if($result){

        $data = array(

          'message' => $result,

        );

        echo json_encode($data);

        exit();

      } else { 

        usleep(1000);

        exit();

        //return;

      }

    }

    session_write_close();

  }

var cometURL ="{:U(GROUP_NAME.'/Comet/index')}"

  $(function () {

    (function longPolling() {

      //alert(Date.parse(new Date())/1000);

      $.ajax({

        url: cometURL,

        data: {"timed": Date.parse(new Date())/1000,"uid":$("#uid-hidden").val()},

        dataType:"json",

        timeout: 5000,

        error: function (XMLHttpRequest, textStatus, errorThrown) {

          if (textStatus =="timeout") { 

            longPolling();

          } else { 

            longPolling();

          }

        },

        success: function (data, textStatus) {

          if(data.message != 0){

          $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

          $("#messagenum").html('message('+data.message+')');

          }

          if(data.image != 0){

            $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

            $("#imagenum").html('New Image('+data.image+')');

          }

          if (textStatus =="success") { 

            longPolling();

          }

        }

      });

    })();

  });

js:

<li>

<i class="fa fa-warning fa-2x">

  <?php if ($totalRows_event > 0) { ?>

    <span class="label label-danger blink"><?php echo $totalRows_event ?></span>

  <?php } ?>



</li>
function testAjax() {

  var result ="";

  $.ajax({

    url:"data.php",

    async: false,

    success: function (data, textStatus) {

      $("#preview").html(data);

    },

    error: function () {

      alert('Not OKay');

    }

  });

  return result;

}

<li>



 <i class="fa fa-warning fa-2x">

 <span class="label label-danger blink" id="preview"></span>



</li>

public function index()

  {

    if (!$_GET['timed']) exit();

    if (!$_GET['uid']) exit();

    date_default_timezone_set("PRC");

    set_time_limit(0);

    $uid = $_GET['uid'];

    while (true) {

      sleep(3); 

      $lastReadTime = M('readtime')->where(array('uid'=>$uid))->field('lasttime')->select();

      $result = M('message')->where(array('send_time'=>array('gt',$lastReadTime),'touid'=>$uid))->count();

      if($result){

        $data = array(

          'message' => $result,

        );

        echo json_encode($data);

        exit();

      } else { 

        usleep(1000);

        exit();

        //return;

      }

    }

    session_write_close();

  }

var cometURL ="{:U(GROUP_NAME.'/Comet/index')}"

  $(function () {

    (function longPolling() {

      //alert(Date.parse(new Date())/1000);

      $.ajax({

        url: cometURL,

        data: {"timed": Date.parse(new Date())/1000,"uid":$("#uid-hidden").val()},

        dataType:"json",

        timeout: 5000,

        error: function (XMLHttpRequest, textStatus, errorThrown) {

          if (textStatus =="timeout") { 

            longPolling();

          } else { 

            longPolling();

          }

        },

        success: function (data, textStatus) {

          if(data.message != 0){

          $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

          $("#messagenum").html('message('+data.message+')');

          }

          if(data.image != 0){

            $(document.body).append("<i class='iconfont'style='position: fixed;top: 28px;right: 30px;color: #2fa8ec;font-size: 20px'>");

            $("#imagenum").html('New Image('+data.image+')');

          }

          if (textStatus =="success") { 

            longPolling();

          }

        }

      });

    })();

  });

我正在使用 THINKPHP 和 Jquery，你可以将其更改为你的方式。(AJAX LONG PULLING)。或者如果你的工作区在 linux 中，你可以使用 swoole 或 workerman 或 websocket 来制作。

赞 (0)
« 上一篇
下一篇 »

相关推荐

  • Spring部署设置openshift

    Springdeploymentsettingsopenshift我有一个问题让我抓狂了三天。我根据OpenShift帐户上的教程部署了spring-eap6-quickstart代码。我已配置调试选项，并且已将Eclipse工作区与OpehShift服务器同步-服务器上的一切工作正常，但在Eclipse中出现无法消除的错误。我有这个错误：cvc-complex-type.2.4.a:Invali…
    2025-04-161

  • 检查Java中正则表达式中模式的第n次出现

    CheckfornthoccurrenceofpatterninregularexpressioninJava本问题已经有最佳答案，请猛点这里访问。我想使用Java正则表达式检查输入字符串中特定模式的第n次出现。你能建议怎么做吗？这应该可以工作：MatchResultfindNthOccurance(intn,Patternp,CharSequencesrc){Matcherm=p.matcher…
    2025-04-161

  • 如何让 JTable 停留在已编辑的单元格上

    HowtohaveJTablestayingontheeditedcell如果有人编辑JTable的单元格内容并按Enter，则内容会被修改并且表格选择会移动到下一行。是否可以禁止JTable在单元格编辑后转到下一行？原因是我的程序使用ListSelectionListener在单元格选择上同步了其他一些小部件，并且我不想在编辑当前单元格后选择下一行。Enter的默认绑定是名为selectNext…
    2025-04-161

  • Weblogic 12c 部署

    Weblogic12cdeploy我正在尝试将我的应用程序从Tomcat迁移到Weblogic12.2.1.3.0。我能够毫无错误地部署应用程序，但我遇到了与持久性提供程序相关的运行时错误。这是堆栈跟踪：javax.validation.ValidationException:CalltoTraversableResolver.isReachable()threwanexceptionatorg.…
    2025-04-161

  • Resteasy Content-Type 默认值

    ResteasyContent-Typedefaults我正在使用Resteasy编写一个可以返回JSON和XML的应用程序，但可以选择默认为XML。这是我的方法：@GET@Path("/content")@Produces({MediaType.APPLICATION_XML,MediaType.APPLICATION_JSON})publicStringcontentListRequestXm…
    2025-04-161

  • 代码不会停止运行，在 Java 中

    thecodedoesn'tstoprunning,inJava我正在用Java解决项目Euler中的问题10，即"Thesumoftheprimesbelow10is2+3+5+7=17.Findthesumofalltheprimesbelowtwomillion."我的代码是packageprojecteuler_1;importjava.math.BigInteger;importjava…
    2025-04-161

  • Out of memory java heap space

    Outofmemoryjavaheapspace我正在尝试将大量文件从服务器发送到多个客户端。当我尝试发送大小为700mb的文件时，它显示了"OutOfMemoryjavaheapspace"错误。我正在使用Netbeans7.1.2版本。我还在属性中尝试了VMoption。但仍然发生同样的错误。我认为阅读整个文件存在一些问题。下面的代码最多可用于300mb。请给我一些建议。提前致谢publicc…
    2025-04-161

  • Log4j 记录到共享日志文件

    Log4jLoggingtoaSharedLogFile有没有办法将log4j日志记录事件写入也被其他应用程序写入的日志文件。其他应用程序可以是非Java应用程序。有什么缺点？锁定问题？格式化？Log4j有一个SocketAppender，它将向服务发送事件，您可以自己实现或使用与Log4j捆绑的简单实现。它还支持syslogd和Windows事件日志，这对于尝试将日志输出与来自非Java应用程序…
    2025-04-161
手机版技术脚本