zoukankan      html  css  js  c++  java
  • 用XMLHTTP实现无刷新的与server通信

    XMLHTTP的用处很多,这里只说我们需要的,就是无刷新的与server通信,看这段代码:

    代码:
    <script language="javascript">
    xml = new ActiveXObject("Microsoft.XMLHTTP");
    var post=" ";//构造要携带的数据
    xml.open("POST","http://localhost:7001/TestWL/index.jsp",false);//使用POST方法打开一个到服务器的连接,以异步方式通信
    xml.setrequestheader("content-length",post.length);
    xml.setrequestheader("content-type","application/x-www-form-urlencoded");
    xml.send(post);//发送数据
    var res = xml.responseText;//接收服务器返回的数据
    document.write(res);
    </script>

    豁然开朗,这段代码就是打开一个HTTP连接,以标准的HTTP格式传递数据,如果你喜欢,可以用XML的格式来传递。更改一下xml对象的构造方式就可以兼容Mozilla和Netscape。下面来写一个轮询,每隔一段时间刷新一次用户列表,当然,是不需要刷新页面的:
    代码:
    <html>
    <head><title>探测器</title>
    <script language="javascript">
    function detect()
    {
    xml = new ActiveXObject("Microsoft.XMLHTTP");
    var post=" ";//构造要携带的数据
    xml.open("POST","http://localhost:7001/TestWL/index.jsp",false);//使用POST方法打开一个到服务器的连接,以异步方式通信
    xml.setrequestheader("content-length",post.length);
    xml.setrequestheader("content-type","application/x-www-form-urlencoded");
    xml.send(post);//发送数据
    var res = xml.responseText;//接收服务器返回的数据
    list.innerText=res;
    setTimeout(“detect()”,5000);//每隔5秒钟轮询一次
    }
    </script>
    <body onload=”detect()”>
    <a id=”list”></a>
    </body>
    </html>

    这样的通信方式数据量很小,不用重新传递整个页面,5秒钟轮一次,普通PC也能承受较大的在线数。构造一个探测器来监听在线列表和消息,效果是很好的,即使你的客户坐在电脑前袖手旁观,键鼠都不碰一下,也能保证数据即时传递,页面也不会发生跳转和刷新。

    Session监听加上XMLHTTP通信,开发一个较为完善的站内消息系统实在易如反掌。'
  • 相关阅读:
    从源码解读Spring如何解决bean循环依赖
    前后端分离下用jwt做用户认证
    断点调试获取程序当前位置的运行结果
    Win10安装MySQL8压缩包版
    IDEA实用快捷键推荐
    多平台博客发布工具OpenWrite的使用
    Tomcat部署多个war包
    从储值卡(会员卡)充值业务看分布式事务的设计
    再谈 PHP 未来之路
    Swoole 实战:MySQL 查询器的实现(协程连接池版)
  • 原文地址:https://www.cnblogs.com/newwind521/p/699719.html
Copyright © 2011-2022 走看看