zoukankan      html  css  js  c++  java
  • 《HTML5数据推送应用开发》源码java版之一-----helloworld

    1.新建servelet,然后进行编码,最后编码完后的源码如下:

    package com.heetian.servlet;
    
    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.Date;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    /**
     * Servlet implementation class SSEEchoServlet
     */
    @WebServlet("/SSEEchoServlet")
    public class SSEEchoServlet extends HttpServlet {
    	private static final long serialVersionUID = 1L;
    
    	/**
    	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
    	 *      response)
    	 */
    	protected void doGet(HttpServletRequest request,
    			HttpServletResponse response) throws ServletException, IOException {
    		// TODO Auto-generated method stub
    		response.setContentType("text/event-stream");//设置事件流
    		response.setCharacterEncoding("UTF-8");//设置编码
                    //获取最新时间并返回
    		PrintWriter writer = response.getWriter();
    		String string = new Date().toString();
    		System.out.println(string);
    		// send SSE
    		writer.write("data: " + string + "
    
    ");
    		try {   //设置间隔时间
    			Thread.sleep(1000);
    		} catch (InterruptedException e) {
    			// TODO Auto-generated catch block
    			e.printStackTrace();
    		}
    
    	}
    }
    

    2.新建index.html文件,然后进行编码。编码后的文件如下:


            <!doctype html>
            <html>
              <head>
                <meta charset="UTF-8">
                <title>Basic SSE Example</title>
              </head>
              <body>
                <pre id="x">初始化...</pre><!--之所以用pre,没用div或p,是为了确保(包括换行的数据能够以它被接收时的格式呈现,而不会被修改或格式化。)-->
                <script>
                var es = new EventSource("SSEEchoServlet");//创建EventSource对象,将要连接的URL作为它唯一的参数。这里是连接到basic_sse.php
                es.addEventListener("message", function(e){
                  document.getElementById("x").innerHTML += "
    " + e.data;//运态修改页面内容。
                  },false);
                </script>。
              </body>
            </html>

    3. 运行后,可以看到浏览器中不停输出时间。效果如下:

    初始化...
    Sun Nov 23 13:56:22 CST 2014
    Sun Nov 23 13:56:27 CST 2014
    Sun Nov 23 13:56:31 CST 2014
    Sun Nov 23 13:56:35 CST 2014
    Sun Nov 23 13:56:39 CST 2014
    Sun Nov 23 13:56:43 CST 2014
    Sun Nov 23 13:56:47 CST 2014
    Sun Nov 23 13:56:51 CST 2014
    Sun Nov 23 13:56:55 CST 2014
    Sun Nov 23 13:56:59 CST 2014
    Sun Nov 23 13:57:03 CST 2014
    。


    说明

    1. 本系列是根据《Data Push Apps with HTML5 SSE》一书的源码修改而成,该书源码为PHP版,本人在学习过程中,根据个人需求及理解,修改成了JAVA版。所以有关例子的细节,请参阅该书。

    2.本系列工程使用maven管理。如果对maven不了解,请自行google或baidu。或者自行将maven工程转化为普通java工程,项目所依赖jar包,请参见pom.xml。

    3.本系列博客为原创,谢绝转载。

  • 相关阅读:
    PointToPointNetDevice doesn't support TapBridgeHelper
    NS3系列—10———NS3 NodeContainer
    NS3系列—9———NS3 IP首部校验和
    NS3系列—8———NS3编译运行
    【习题 7-6 UVA
    【Good Bye 2017 C】 New Year and Curling
    【Good Bye 2017 B】 New Year and Buggy Bot
    【Good Bye 2017 A】New Year and Counting Cards
    【Educational Codeforces Round 35 D】Inversion Counting
    【Educational Codeforces Round 35 C】Two Cakes
  • 原文地址:https://www.cnblogs.com/okuc/p/4129598.html
Copyright © 2011-2022 走看看