WebSocket

Sockjs

Stoup (消息订阅发布)

添加依赖

<!-- 添加依赖 -->

    <dependencies>

        <dependency>

            <groupId>javax.servlet</groupId>

            <artifactId>javax.servlet-api</artifactId>

            <version>${servlet.version}</version>

            <scope>provided</scope>

        </dependency>

        <dependency>

            <groupId>org.springframework</groupId>

            <artifactId>spring-webmvc</artifactId>

            <version>${spring.version}</version>

        </dependency>

        <dependency>

            <groupId>org.springframework</groupId>

            <artifactId>spring-websocket</artifactId>

            <version>${spring.version}</version>

        </dependency>

        <dependency>

            <groupId>com.fasterxml.jackson.core</groupId>

            <artifactId>jackson-databind</artifactId>

            <version>${jackson.version}</version>

        </dependency>

    </dependencies>

全局类

UserController

package edu.nf.ws.controller;

import edu.nf.ws.controller.vo.ResponseVO;

import edu.nf.ws.entity.Users;

import org.springframework.http.HttpStatus;

import org.springframework.web.bind.annotation.PostMapping;

import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpSession;

/**

 * @Author Eric

 * @Date 2018/12/6

 */

@RestController

public class UserController {

    @PostMapping("/userLogin")

    public ResponseVO login(Users user, HttpSession session){

        //验证用户

        //....

        //验证成功后将用户放进会话作用域

        session.setAttribute("user",user);

        ResponseVO responseVO = new ResponseVO();

        responseVO.setCode(HttpStatus.OK.value());

        responseVO.setData("index.html");

        return responseVO;

    }

}
ServerEndpointHandler
package edu.nf.ws.websocket;

import edu.nf.ws.entity.Users;

import org.springframework.web.socket.CloseStatus;

import org.springframework.web.socket.TextMessage;

import org.springframework.web.socket.WebSocketSession;

import org.springframework.web.socket.handler.TextWebSocketHandler;

import java.util.Map;

import java.util.concurrent.ConcurrentHashMap;

/**

 * @Author Eric

 * @Date 2018/12/6

 * websocket服务端

 */

public class ServerEndpointHandler extends TextWebSocketHandler {

    /**

     * 维护一个用户列表（key存放用户名，value存放每个用户的WebSocketSession）

     */

    private static Map<String, WebSocketSession> users = new ConcurrentHashMap<>();

    /**

     * 客户端建立连接之后执行此方法（onOpen）

     * @param session 每当客户端连接后，容器会为其创建一个Session对象，

     *                  这个对象在Spring中就是WebSpcketSession

     * @throws Exception

     */

    @Override

    public void afterConnectionEstablished(WebSocketSession session) throws Exception {

        System.out.println("客户端建立了连接...");

        //获取用户名，getAttributes方法得到的是一个Map

        //这个map里面存放了握手拦截器将HttpSession作用域拷贝过去的数据

        Users user = (Users)session.getAttributes().get("user");

        //将用户的session保存到用户列表中

        users.put(user.getUserName(),session);

    }

    /**

     * 每当客户端发送信息时执行此方法（onmessage）

     * @param session

     * @param message   TextMessage对象表示接受客户端的文本信息对象

     *                  它的getPayload方法将获得具体消息内容

     * @throws Exception

     */

    @Override

    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {

        System.out.println("接收客户端消息..."+message);

        //获取用户名

        Users sendUser = (Users)session.getAttributes().get("user");

        //群发消息

        for (String userName : users.keySet()) {

            //重新构建一个TextMessage对象

            TextMessage newMessage = new TextMessage(sendUser.getUserName()+":"+message.getPayload());

            //发送所有人

            users.get(userName).sendMessage(newMessage);

        }

    }

    /**

     * 客户端关闭或者断开连接时执行此方法（onclose）

     * @param session

     * @param status

     * @throws Exception

     */

    @Override

    public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {

        System.out.println("客户端断开连接...");

        session.close();

    }

}

index.html

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title>发送内容</title>

</head>

<body>

    <div align="center">

        <div class="content-padded" >

            <div id="content"></div>

        </div>

        <div class="item-input">

            <input type="text" id="msg" placeholder="输入内容..">

        </div>

        <div class="col-100">

            <p><a class="button" id="btn" style="width:200px">send</a></p>

        </div>

    </div>

<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>

<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">

<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>

<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>

</body>

<script>

    $(function () {

        var ws = new WebSocket('ws://localhost:8080/websocket');

        ws.onmessage = function (event) {

            $('#content').append(event.data + '<br>');

        }

        $('#btn').on('click',function () {

            var msg = $('#msg').val();

            //发送信息

            ws.send(msg);

        });

    });

</script>

</html>

login.html

<!DOCTYPE html>

<html>

<meta charset="utf-8">

<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">

<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>

<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>

<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>

<head>

    <a class="button button-link button-nav pull-left" href="/demos/card" data-transition='slide-out'>

        <span class="icon icon-left"></span>

        返回

    </a>

    <h1 class="title">我的App</h1>

</head>

<body>

<nav class="bar bar-tab">

    <a class="tab-item active" href="#">

        <span class="icon icon-home"></span>

        <span class="tab-label">首页</span>

    </a>

    <a class="tab-item" href="#">

        <span class="icon icon-me"></span>

        <span class="tab-label">我</span>

    </a>

    <a class="tab-item" href="#">

        <span class="icon icon-star"></span>

        <span class="tab-label">收藏</span>

    </a>

    <a class="tab-item" href="#">

        <span class="icon icon-settings"></span>

        <span class="tab-label">设置</span>

    </a>

</nav>

<div class="content">

    <div class="list-block">

        <form id="f1">

            <ul>

                <!-- Text inputs -->

                <li>

                    <div class="item-content">

                        <div class="item-inner">

                            <div class="item-title label">Name</div>

                            <div class="item-input">

                                <input type="text" name="userName" placeholder="Your name">

                            </div>

                        </div>

                    </div>

                </li>

                <li>

                    <div class="item-content">

                        <div class="item-inner">

                            <div class="item-title label">Password</div>

                            <div class="item-input">

                                <input type="password" name="password" placeholder="password">

                            </div>

                        </div>

                    </div>

                </li>

            </ul>

        </form>

    </div>

    <div class="content-block">

        <div class="row">

            <div class="col-50"><a href="#" class="button button-big button-fill button-danger">取消</a></div>

            <div class="col-50"><a href="#" id="btn" class="button button-big button-fill button-success">注册</a></div>

        </div>

    </div>

</div>

</body>

<script>

    $(function(){

        $("#btn").on("click",function(){

            $.ajax({

                type:"post",

                url:"userLogin",

                data:$("#f1").serialize(),

                success:function(result){

                    if(result.code==200){

                        location.href=result.data;

                    }else {

                        alert(result.mesage);

                    }

                }

            });

        });

    });

</script>

</html>

配置web.xml和dispatcher-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"

         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"

         version="4.0">

    <servlet>

        <servlet-name>dispatcher</servlet-name>

        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>

        <init-param>

            <param-name>contextConfigLocation</param-name>

            <param-value>classpath:dispatcher-servlet.xml</param-value>

        </init-param>

    </servlet>

    <servlet-mapping>

        <servlet-name>dispatcher</servlet-name>

        <url-pattern>/</url-pattern>

    </servlet-mapping>

</web-app>
<?xml version="1.0" encoding="UTF-8"?>

<beans xmlns="http://www.springframework.org/schema/beans"

       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

       xmlns:context="http://www.springframework.org/schema/context"

       xmlns:mvc="http://www.springframework.org/schema/mvc"

       xmlns:websocket="http://www.springframework.org/schema/websocket"

       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd http://www.springframework.org/schema/websocket http://www.springframework.org/schema/websocket/spring-websocket.xsd">

    <context:component-scan base-package="edu.nf.ws"/>

    <mvc:annotation-driven/>

    <mvc:default-servlet-handler/>

    <!--配置WebSocket的handler-->

    <bean id="serverEndpoint" class="edu.nf.ws.websocket.ServerEndpointHandler"/>

    <!--配置websocket-->

    <websocket:handlers>

        <!--path为websocket连接的url,handler引用我们定义的ServerEndpoint-->

        <websocket:mapping path="/websocket" handler="serverEndpoint"/>

        <!--配置HttpSession握手拦截器-->

        <!--说明：这个握手拦截器会将HttpSession中的数据拷贝到

                WebSocketSession的属性中，因此在WebSocket中

                也能访问会话作用域的信息-->

        <websocket:handshake-interceptors>

            <bean class="org.springframework.web.socket.server.support.HttpSessionHandshakeInterceptor"/>

        </websocket:handshake-interceptors>

    </websocket:handlers>

</beans>

Spring-WebSocket的更多相关文章

  1. spring websocket源码分析续Handler的使用

    1. handler的定义 spring websocket支持的消息有以下几种: 对消息的处理就使用了Handler模式,抽象handler类AbstractWebSocketHandler.jav ...

  2. spring WebSocket详解

    场景 websocket是Html5新增加特性之一,目的是浏览器与服务端建立全双工的通信方式,解决http请求-响应带来过多的资源消耗,同时对特殊场景应用提供了全新的实现方式,比如聊天.股票交易.游戏 ...

  3. spring+websocket整合

    java-websocket的搭建非常之容易,没用框架的童鞋可以在这里下载撸主亲自调教好的java-websocket程序: Apach Tomcat 8.0.3+MyEclipse+maven+JD ...

  4. 【转】Spring websocket 使用

    http://docs.spring.io/spring/docs/current/spring-framework-reference/html/websocket.html https://spr ...

  5. web即时通讯2--基于Spring websocket达到web聊天室

    如本文所用,Spring4和websocket要构建web聊天室,根据框架SpringMVC+Spring+Hibernate的Maven项目,后台使用spring websocket进行消息转发和聊 ...

  6. spring+websocket综合（springMVC+spring+MyBatis这是SSM框架和websocket集成技术）

    java-websocket该建筑是easy.儿童无用的框架可以在这里下载主线和个人教学好java-websocket计划: Apach Tomcat 8.0.3+MyEclipse+maven+JD ...

  7. Spring 学习——基于Spring WebSocket 和STOMP实现简单的聊天功能

    本篇主要讲解如何使用Spring websocket 和STOMP搭建一个简单的聊天功能项目,里面使用到的技术,如websocket和STOMP等会简单介绍,不会太深,如果对相关介绍不是很了解的,请自 ...

  8. Spring Websocket实现简易在线聊天功能

    针对Spring Websocket的实现,我参照了其他博主的文章https://www.cnblogs.com/leechenxiang/p/5306372.html 下面直接给出实现: 一.引入相 ...

  9. Spring WebSocket踩坑指南

    Spring WebSocket踩坑指南 本次公司项目中需要在后台与安卓App间建立一个长连接,这里采用了Spring的WebSocket,协议为Stomp. 关于Stomp协议这里就不多介绍了,网上 ...

  10. Spring WebSocket初探2 (Spring WebSocket入门教程)<转>

    See more: Spring WebSocket reference整个例子属于WiseMenuFrameWork的一部分,可以将整个项目Clone下来,如果朋友们有需求,我可以整理一个独立的de ...

随机推荐

  1. H5入门

    1.基本骨架 <!DOCTYPE html> <html> <head><title>标题</title><meta charset= ...

  2. http://www.bugku.com：Bugku——jsfuckWEB5（http://120.24.86.145:8002/web5/index.php）

      今天又做了bugku上面的一道题.使用到了jsfuck,它是什么捏?   它是Javascript原子化的一种简易表达方式,用[]()!+就可以表示所有的Javascript字符,不依赖于浏览器. ...

  3. eval详解

    eval()的作用 把字符串参数解析成js代码并运行,并返回执行的结果: eval的作用域 作用域在它所有的范围内容有效 IE8及以下指向window 解决方法: functiona(){ if(wi ...

  4. mysql left join 多条记录 1:n 的处理方法

    一.准备两张表,文章表和评伦表 CREATE TABLE `article` ( `id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT 'ID', ...

  5. 比特币系列钱包的UTXO总结

    1.通过比特币钱包的WalletNotify配置来处理 本钱包内的交易信息的 推送.BlockNotify数据更多,不适合交易所的监听

  6. linux arm-linux-gcc 安装编译

    1,将  .tgz  安装包通过SSH传至ubuntu 2,tar -zxvf  arm-linux-gcc.tgz     解压 3,配置环境变量(由于鄙人只需其中一个用户使用,所以直接再其主目录) ...

  7. java命令行调用本地文件协议hikvideoclient://

    最近在做一个视频项目,项目中需要通过调用海康本地协议打开视频播放器,起初尝试通过Process/ProcessBuilder无解,因为这个是调用本地应用程序的. 我要调用的是本地伪协议,最终通过一些研 ...

  8. 在threejs中添加两个场景和相机是需要注意render的参数设置

    问题:我刚开始设置了两个场景和相机 但是第二个一直将第一个场景给覆盖了一直找不到原因 解决: 问题出在 renderer.autoClear = false;上 设置render的参数如下: rend ...

  9. 学习knockoutjs轻量级的MVVM框架

    教程:knockoutjs介绍 http://www.w3cfuns.com/forum.php?mod=viewthread&tid=5598714 MVVM架构~knockoutjs实现简 ...

  10. 9.4-9.19 h5日记总结

    总结: 1.标签 (1)单.双标签 (2)块级.行级标签 (3)标签的属性 2.CSS (1)选择器 *.id.class.标签.后代.子代.并集.交集.伪类.结构 (2)层叠性,即选择器权重的计算 ...