zoukankan      html  css  js  c++  java
  • 学习WebSocket(三)

    webSocket 服务器

    import javax.websocket.OnClose;
    import javax.websocket.OnError;
    import javax.websocket.OnOpen;
    import javax.websocket.Session;
    import javax.websocket.server.ServerEndpoint;
    import java.io.IOException;
    import java.util.concurrent.CopyOnWriteArraySet;
    
    /**
     * @ServerEndpoint 注解是一个类层次的注解,它的功能主要是将目前的类定义成一个websocket服务器端,
     * 注解的值将被用于监听用户连接的终端访问URL地址,客户端可以通过这个URL来连接到WebSocket服务器端
     */
    @ServerEndpoint("/websocket")
    public class MyWebSocket {
        /**
         * 与某个客户端的连接会话,需要通过它来给客户端发送数据
         */
        private Session session;
    
        //concurrent包的线程安全Set,用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话,可以使用Map来存放,其中Key可以为用户标识
        private static CopyOnWriteArraySet<MyWebSocket> webSocketSet = new CopyOnWriteArraySet<MyWebSocket>();
    
        /**
         * 连接建立成功调用的方法
         * Session是webSocket的回话,一个session 代表一个通信会话
         *
         * @param session 可选的参数。session为与某个客户端的连接会话,需要通过它来给客户端发送数据
         */
        @OnOpen
        public void onOpen(Session session) {
            this.session = session;
            webSocketSet.add(this);
            System.out.println("sessionID:" + session.getId());
    //    WebSocketMapUtil.put(session.getQueryString().split("=")[1],session);
        }
    
        /**
         * 连接关闭调用的方法
         */
        @OnClose
        public void onClose() {
            //从map中删除
            webSocketSet.remove(this);
    //    WebSocketMapUtil.remove(session.getQueryString().split("=")[1]);
            System.out.println("连接关闭");
        }
    
        /**
         * 发生错误时调用
         *
         * @param session
         * @param error
         */
        @OnError
        public void onError(Session session, Throwable error) {
            error.printStackTrace();
        }
    
        /**
         * 发送消息方法。
         *
         * @param message
         * @throws IOException
         */
        public void sendMessage(String message) throws IOException {
            this.session.getBasicRemote().sendText(message);  ---------------如果直接调用这个方法。this.session这个值是null.所以需要下面的方法进行对session的遍历。
        }
    
        /**
         * 发送消息方法。
         *
         * @param message
         * @throws IOException
         */
        public void sendMessageToWeb(String message) throws IOException {
            for (MyWebSocket item : webSocketSet) {
                try {
                    item.sendMessage(message);
                } catch (IOException e) {
                    e.printStackTrace();
                    continue;
                }
            }
        }
    }

    文章二的那种方式。适用于特定的需求需要。

    海康设备视频预览功能

    <%@ page language="java" import="java.util.*" pageEncoding="Utf-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <!doctype html>
    <%
        String path = request.getContextPath();
        String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    <html lang="en">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Pragma" content="no-cache" />
        <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
        <meta http-equiv="Expires" content="0" />
        <script>
            document.write("<link type='text/css' href='<%=basePath %>module/css/video/demo.css?version=" + new Date().getTime() + "' rel='stylesheet' />");
        </script>
        <link href="<%=basePath %>media/assets/css/bootstrap.css" rel="stylesheet">
    </head>
    <style>
        .wrapper {
            margin-top:70px !important;
        }
    </style>
    
    <body>
    <section class="wrapper">
        <div class="left">
            <div id="divPlugin" class="plugin"></div>
            <input type="button" class="btn" value="开始预览" onclick="clickStartRealPlay();" />
            <fieldset class="login" style="display: none">
                <legend>登录</legend>
                <table cellpadding="0" cellspacing="3" border="0">
                    <tr>
                        <td class="tt">IP地址</td>
                        <td><input id="loginip" type="text" class="txt" value="${classIp.ip}" /></td>
                        <td class="tt">端口号</td>
                        <td><input id="port" type="text" class="txt" value="80" /></td>
                    </tr>
                    <tr>
                        <td class="tt">用户名</td>
                        <td><input id="username" type="text" class="txt" value="${classIp.name}" /></td>
                        <td class="tt">密码</td>
                        <td><input id="password" type="password" class="txt" value="${classIp.password}" /></td>
                    </tr>
                    <tr>
                        <td class="tt">设备端口</td>
                        <td colspan="2"><input id="deviceport" type="text" class="txt" value="8000" />(可选参数)</td>
                        <td>
                            窗口分割数&nbsp;
                            <select class="sel2" onchange="changeWndNum(this.value);">
                                <option value="1" selected >1x1</option>
                                <option value="2">2x2</option>
                                <option value="3">3x3</option>
                                <option value="4">4x4</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="4">
                            <input type="button" class="btn" value="登录" id="clickLoginBtn" onclick="clickLogin();" />
                            <input type="button" class="btn" value="退出" onclick="clickLogout();" />
                            <input type="button" class="btn2" value="获取基本信息" onclick="clickGetDeviceInfo();" />
                        </td>
                    </tr>
                    <tr>
                        <td class="tt">已登录设备</td>
                        <td>
                            <select id="ip" class="sel" onchange="getChannelInfo();"></select>
                        </td>
                        <td class="tt">通道列表</td>
                        <td>
                            <select id="channels" class="sel"></select>
                        </td>
                    </tr>
                </table>
            </fieldset>
        </div>
        <div class="left">
            <fieldset class="preview" style="display: none">
                <legend>预览</legend>
                <table cellpadding="0" cellspacing="3" border="0">
                    <tr>
                        <td class="tt">码流类型</td>
                        <td>
                            <select id="streamtype" class="sel">
                                <option value="1">主码流</option>
                                <option value="2">子码流</option>
                                <option value="3">第三码流</option>
                                <option value="4">转码码流</option>
                            </select>
                        </td>
                        <td>
                            <input type="button" class="btn" value="开始预览" onclick="clickStartRealPlay();" />
                            <input type="button" class="btn" value="停止预览" onclick="clickStopRealPlay();" />
                        </td>
                    </tr>
                    <tr>
                        <td class="tt">音量</td>
                        <td>
                            <input type="text" id="volume" class="txt" value="50" maxlength="3" />&nbsp;<input type="button" class="btn" value="设置" onclick="clickSetVolume();" />(范围:0~100)
                        </td>
                        <td>
                            <input type="button" class="btn" value="打开声音" onclick="clickOpenSound();" />
                            <input type="button" class="btn" value="关闭声音" onclick="clickCloseSound();" />
                        </td>
                    </tr>
                    <tr>
                        <td class="tt">对讲通道</td>
                        <td>
                            <select id="audiochannels" class="sel">
    
                            </select>
                            <input type="button" class="btn" value="获取通道" onclick="clickGetAudioInfo();" />
                        </td>
                        <td>
                            <input type="button" class="btn" value="开始对讲" onclick="clickStartVoiceTalk();" />
                            <input type="button" class="btn" value="停止对讲" onclick="clickStopVoiceTalk();" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="3">
                            <input type="button" class="btn" value="抓图" onclick="clickCapturePic();" />
                            <input type="button" class="btn" value="开始录像" onclick="clickStartRecord();" />
                            <input type="button" class="btn" value="停止录像" onclick="clickStopRecord();" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="3">
                            <input type="button" class="btn2" value="启用电子放大" onclick="clickEnableEZoom();" />
                            <input type="button" class="btn2" value="禁用电子放大" onclick="clickDisableEZoom();" />
                            <input type="button" class="btn2" value="启用3D放大" onclick="clickEnable3DZoom();" />
                            <input type="button" class="btn2" value="禁用3D放大" onclick="clickDisable3DZoom();" />
                            <input type="button" class="btn" value="全屏" onclick="clickFullScreen();" />
                        </td>
                    </tr>
                </table>
            </fieldset>
        </div>
    </section>
    
    </body>
    <script src="<%=basePath %>module/js/jquery-1.7.1.min.js"></script>
    <script src="<%=basePath %>module/js/video/webVideoCtrl.js"></script>
    <script src="<%=basePath %>media/plugins/layer/2.4/layer.js"></script>
    <script src="<%=basePath %>module/js/video/demo.js"></script>
    <script type="text/javascript">
        $(function () {
            //触发设备的登录
            $("#clickLoginBtn").click();
            //窗口默认1个
            changeWndNum(1);
            //触发视频预览
            window.setTimeout(clickStartRealPlay(), 1000);
        });
    
    </script>
    </html>
  • 相关阅读:
    dwz 嵌套网页的搜索刷新问题
    dwz 解决remote验证唯一时缓存问题。
    dwz div 局部刷新
    Oracle 递归查询子节点和父节点 函数方法
    关于未能加载文件或程序集“System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35”或它的某一个依赖项的解决办法
    CentOS7搭建vsftp服务器
    Linux下 cmatrix的安装和使用(黑客屏保)
    配置动态web服务(wsgi)
    centos7 搭建discuz 全
    Centos7 更换为阿里源
  • 原文地址:https://www.cnblogs.com/xuerong/p/8926213.html
Copyright © 2011-2022 走看看