zoukankan      html  css  js  c++  java
  • websocket具体如何使用

    本人是在https://blog.csdn.net/jintingbo/article/details/80755636此地址学习的,所以留做笔记用于之后的学习

    现在在写一个工程,是关于监控摄像头的,它的工作过程用下图表示:

    摄像头自动识别车牌号后,就是post到java后端(厂家叫中心服务器), 现在是如何将识别的车牌返到前端去呢?

    因为按照SSM的规则,在java后端处理完摄像头的post后,用return返回时,它是返到摄像头那边,而不是返到前端了。

    为了解决这个问题,我只好在前端与java后端之间架起webSocket通信。

    如何做得呢?

    第一步:应该在pom中加一个

    <!-- 导入java ee jar 包 -->
    <dependency>
    <groupId>javax</groupId>
    <artifactId>javaee-api</artifactId>
    <version>7.0</version>

    </dependency>

    ===============================

    第二步:在前端的html页面(或是jsp页面)这样写:

    $(function(){
     var websocket = null;
       //判断当前浏览器是否支持WebSocket
       if ('WebSocket' in window) {
           websocket = new WebSocket("ws://localhost:9999/guanXiangCamera/websocket");
       }else {
           alert('当前浏览器 Not support websocket')
       }
       //连接发生错误的回调方法
       websocket.onerror = function () {
           setMessageInnerHTML("WebSocket连接发生错误");
       };
       //连接成功建立的回调方法
       websocket.onopen = function () {
           //setMessageInnerHTML("WebSocket连接成功");
       }
       //接收到消息的回调方法
       websocket.onmessage = function (event) {
           setMessageInnerHTML(event.data);
       }
       //连接关闭的回调方法
       websocket.onclose = function () {
           //setMessageInnerHTML("WebSocket连接关闭");
       }
       //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。
       window.onbeforeunload = function () {
           //closeWebSocket();
       }
       //将消息显示在网页上
       function setMessageInnerHTML(innerHTML) {
           document.getElementById('message').innerHTML += innerHTML + '<br/>';
       }
       //关闭WebSocket连接
       function closeWebSocket() {
           websocket.close();
       }
       //发送消息
       function send() {
           var message = "测试一下,看能不能发!"
           websocket.send(message);

       }

    }

    上面的程序,其实你只想接收一个后台向前端的推送,只要这个就行,其它的都可以不要代码,只要一个函数的“架子”。

        //接收到消息的回调方法
        websocket.onmessage = function (event) {
            setMessageInnerHTML(event.data);

        }

    ====================================

    第三步:在java的后端,新建一个类:

    package com.google.controller;

    import java.io.IOException;
    import java.util.concurrent.CopyOnWriteArraySet;

    import javax.websocket.OnClose;
    import javax.websocket.OnError;
    import javax.websocket.OnMessage;
    import javax.websocket.OnOpen;
    import javax.websocket.Session;
    import javax.websocket.server.ServerEndpoint;

    @ServerEndpoint("/websocket")
    public class WebSocketTest {
    //静态变量,用来记录当前在线连接数。应该把它设计成线程安全的。
    private static int onlineCount = 0;
    //concurrent包的线程安全Set,用来存放每个客户端对应的MyWebSocket对象。
    //若要实现服务端与单一客户端通信的话,可以使用Map来存放,其中Key可以为用户标识
    private static CopyOnWriteArraySet<WebSocketTest> webSocketSet = 
    new CopyOnWriteArraySet<WebSocketTest>();
    //与某个客户端的连接会话,需要通过它来给客户端发送数据
    private Session session;
    public Session getSession(){
    return this.session;
    }
    /**
    * 连接建立成功调用的方法
    * @param session  可选的参数。session为与某个客户端的连接会话,需要通过它来给客户端发送数据
    */
    @OnOpen
    public void onOpen(Session session){
    this.session = session;
    webSocketSet.add(this);     //加入set中
    addOnlineCount();           //在线数加1
    System.out.println("有新连接加入!当前在线人数为" + getOnlineCount());
    }
    /**
    * 连接关闭调用的方法
    */
    @OnClose
    public void onClose(){
    webSocketSet.remove(this);  //从set中删除
    subOnlineCount();           //在线数减1
    System.out.println("有一连接关闭!当前在线人数为" + getOnlineCount());
    }
    /**
    * 收到客户端消息后调用的方法
    * @param message 客户端发送过来的消息
    * @param session 可选的参数
    */
    @OnMessage
    public void onMessage(String message, Session session) {
    //System.out.println("来自客户端的消息:" + message);
    //群发消息
    for(WebSocketTest item: webSocketSet){
    try {
    item.sendMessage(message);
    } catch (IOException e) {
    e.printStackTrace();
    continue;
    }
    }
    }
    /**
    * 发生错误时调用
    * @param session
    * @param error
    */
    @OnError
    public void onError(Session session, Throwable error){
    System.out.println("发生错误");
    error.printStackTrace();
    }
    /**
    * 这个方法与上面几个方法不一样。没有用注解,是根据自己需要添加的方法。
    * @param message
    * @throws IOException
    */
    public void sendMessage(String message) throws IOException{
    this.session.getBasicRemote().sendText(message);
    //this.session.getAsyncRemote().sendText(message);
    }
    public static synchronized int getOnlineCount() {
    return onlineCount;
    }

    public static synchronized void addOnlineCount() {
    WebSocketTest.onlineCount++;
    }

    public static synchronized void subOnlineCount() {
    WebSocketTest.onlineCount--;
    }

    }

    ==============================

    第四步:最重要的来了,要在自己的程序中,有推送,该如何做呢?

    只需要使用它的这个类就行了:

    这样就可以把内容传到前台了。

    要注意的事项是: (1)前端的提交,应该提交到 WebSocketTest 类中,而不是提交到你的业务类中,

    (2)后端接受前端提交的webSocket类时,用注解@ServerEndpoint接收。例如:
    @ServerEndpoint("/websocket")

    public class WebSocketTest {}
    ---------------------

    来源:CSDN
    原文:https://blog.csdn.net/jintingbo/article/details/80755636
    版权声明:本文为博主原创文章,转载请附上博文链接!

  • 相关阅读:
    找工作总结
    java设计模式2-观察者模式
    java设计模式1-策略模式
    Hadoop 集群常见错误
    hadoop的conf配置详解
    HDFS的数据导入到HIVE中
    hadoop集群搭建(完全分布式)
    FastDFS的学习
    FastDFS文档整理与研究
    把windows上文件上传到linux系统
  • 原文地址:https://www.cnblogs.com/LiuJL/p/10715220.html
Copyright © 2011-2022 走看看