反向Ajax（轮询）

来源：互联网发布：macbookair怎样装软件编辑：程序博客网时间：2024/06/09 21:26

反向Ajax（轮询）：
客户端设置好一定的时间间隔，每次发送请求给服务器端，服务器端专门为这个客户端启动一个线程并专门处理该请求并对客户端进行回复处理。
模拟场景：
（间隔2秒，以个人动态为例，关注评论后页面局部更新出数字提示客户有动态更新）
客户端：个人动态是否有变化？
服务器端：没变化
客户端：个人动态是否有变化？
服务器端：没变化
…
客户端：个人动态是否有变化？
服务器端：有一个人关注你（页面显示图标提示用户）
…

通过这个案例其实可以发现，这样的轮询对服务器的负载是很重的。所以在用AJax的的时候需要对性能问题考虑到位。

反向Ajax的实现：
1、如果要想支持反向Ajax 的操作处理，那么首先必须要将Servlet 添加为支持反向Ajax。

@WebServlet(urlPatterns="/message",asyncSupported=true)public class MessageServlet extends HttpServlet {}

2、反向Ajax 实现处理的关键在于线程，也就是说用户的所有请求会使用doGet()或者是doPost()来处理，但是如果要想进行操作，则必须将每一个用户的请求封装为一个独立的线程类，随后启动该线程，而以后用户的推送处理将由此线程负责。
但是如果要想实现这种子线程的控制需要一个类的支持：javax.servlet.AsyncContext，此操作可以进行如下处理：
①取得当前的Request 对象：public ServletRequest getRequest()；
②每一个线程可以单独回应：public ServletResponse getResponse()；
③当前的线程对于本次的轮询操作完成：public void complete()。

class MessageThread implements Runnable {    private AsyncContext asc ;    public MessageThread(AsyncContext asc) {        this.asc = asc ; // 轮询的接口}    @Override    public void run() { // 可以进行数据库读取，或者其它消息组件读取        String msg = this.asc.getRequest().getParameter("msg") ;        try {            this.asc.getResponse().getWriter().println("ECHO : " + msg) ;            this.asc.complete();// 告诉客户端，本次的输出完毕了        } catch (Exception e) {            e.printStackTrace();        }    }}

3、如果要想启动这个线程的操作，那么就必须依靠request 对象。
取得AsyncContext 接口对象：public AsyncContext startAsync() throws IllegalStateException；

@SuppressWarnings("serial")@WebServlet(urlPatterns="/message",asyncSupported=true)public class MessageServlet extends HttpServlet {    class MessageThread implements Runnable {        private AsyncContext asc ;        public MessageThread(AsyncContext asc) {            this.asc = asc ; // 轮询的接口        }        @Override        public void run() { // 可以进行数据库读取，或者其它消息组件读取            String msg = this.asc.getRequest().getParameter("msg") ;            try {                this.asc.getResponse().getWriter().println("ECHO : " + msg) ;                this.asc.complete();// 告诉客户端，本次的输出完毕了            } catch (Exception e) {                e.printStackTrace();            }        }    }    @Override    protected void doGet(HttpServletRequest request,HttpServletResponse response) throwsServletException, IOException {        request.setCharacterEncoding("UTF-8");        response.setCharacterEncoding("UTF-8");        AsyncContext asc = request.startAsync() ; // 准备启动一个反向Ajax线程对象        asc.start(new MessageThread(asc)); // 启动了一个新的线程    }    @Override    protected void doPost(HttpServletRequest request,HttpServletResponse response) throwsServletException, IOException {        this.doGet(request, response);    }}

4、在页面使用反向Ajax 进行轮询处理；

<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>Echo.htm（静态页面）</title>    <script type="text/javascript">        var xmlHttpRequest ; // 这个是Ajax主要的处理对象        function create() { // 该函数的主要功能是创建XmlHttpRequest对象            if (window.XMLHttpRequest) { // 当前浏览器不是IE                xmlHttpRequest = new XMLHttpRequest() ; // 直接创建对象            } else { // 如果是IE则需要通过ActiveX进行对象创建                xmlHttpRequest = new ActiveXObject("Microsoft.XMLHttp") ;            }        }        window.onload = function() {            loadMessage("www.mldnjava.cn") ;        }        function loadMessage(msg) {            create() ;            xmlHttpRequest.open("post","message?msg=" + msg) ; // 地址重写            xmlHttpRequest.send(null) ; // 表示发送请求            xmlHttpRequest.onreadystatechange = function() {            if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {                document.getElementById("showDiv").innerHTML += "<p>" +xmlHttpRequest.responseText + "</p>" ;                window.setTimeout(function(){                    loadMessage("www.mldn.cn") ;                },2000) ;            }        }    }    </script></head><body>    <div id="showDiv"></div></body></html>

0 0