springboot整合websocket

最新推荐文章于 2024-07-19 11:10:22 发布
最新推荐文章于 2024-07-19 11:10:22 发布
阅读量1.4k 收藏 1
点赞数
分类专栏： websocket
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cisco_huang/article/details/87908457
版权

参考链接:https://spring.io/guides/gs/messaging-stomp-websocket/

使用Maven构建项目pom文件参考, 其它工具构建方式类似, 具体参考官网

<parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.0.5.RELEASE</version>
    </parent>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-websocket</artifactId>
        </dependency>

        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>webjars-locator-core</artifactId>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>sockjs-client</artifactId>
            <version>1.0.2</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>stomp-websocket</artifactId>
            <version>2.3.3</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>bootstrap</artifactId>
            <version>3.3.7</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>jquery</artifactId>
            <version>3.1.0</version>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

    <properties>
        <java.version>1.8</java.version>
    </properties>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

创建两个java实体类

public class HelloMessage {

    private String name;

    public HelloMessage() {
    }

    public HelloMessage(String name) {
        this.name = name;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

public class Greeting {
    private String content;

    public Greeting() {
    }

    public Greeting(String content) {
        this.content = content;
    }

    public String getContent() {
        return content;
    }
}

新建controller文件

@Controller
public class GreetingController {


    @MessageMapping("/hello")
    @SendTo("/topic/greetings")
    public Greeting greeting(HelloMessage message) throws Exception {
        Thread.sleep(1000); // simulated delay
        return new Greeting("Hello, " + HtmlUtils.htmlEscape(message.getName()) + "!");
    }

}

新建配置文件

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    /**
     * 配置消息代理(中介)
     * enableSimpleBroker 服务端推送给客户端的路径前缀
     * setApplicationDestinationPrefixes  客户端发送数据给服务器端的一个前缀
     */
    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
        config.setApplicationDestinationPrefixes("/app");
    }

    /**
     * 注册端点，发布或者订阅消息的时候需要连接此端点
     * setAllowedOrigins 非必须，*表示允许其他域进行连接
     * withSockJS  表示开始sockejs支持
     */
    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/gs-guide-websocket").withSockJS();
    }

}

在src/main/resources/static/ 目录新建index.html

<!DOCTYPE html>
<html>
<head>
    <title>Hello WebSocket</title>
    <link href="/webjars/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="/main.css" rel="stylesheet">
    <script src="/webjars/jquery/jquery.min.js"></script>
    <script src="/webjars/sockjs-client/sockjs.min.js"></script>
    <script src="/webjars/stomp-websocket/stomp.min.js"></script>
    <script src="/app.js"></script>
</head>
<body>
<noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websocket relies on Javascript being
    enabled. Please enable
    Javascript and reload this page!</h2></noscript>
<div id="main-content" class="container">
    <div class="row">
        <div class="col-md-6">
            <form class="form-inline">
                <div class="form-group">
                    <label for="connect">WebSocket connection:</label>
                    <button id="connect" class="btn btn-default" type="submit">Connect</button>
                    <button id="disconnect" class="btn btn-default" type="submit" disabled="disabled">Disconnect
                    </button>
                </div>
            </form>
        </div>
        <div class="col-md-6">
            <form class="form-inline">
                <div class="form-group">
                    <label for="name">What is your name?</label>
                    <input type="text" id="name" class="form-control" placeholder="Your name here...">
                </div>
                <button id="send" class="btn btn-default" type="submit">Send</button>
            </form>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <table id="conversation" class="table table-striped">
                <thead>
                <tr>
                    <th>Greetings</th>
                </tr>
                </thead>
                <tbody id="greetings">
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
</html>

在src/main/resources/static/ 目录新建app.js文件

var stompClient = null;

function setConnected(connected) {
    $("#connect").prop("disabled", connected);
    $("#disconnect").prop("disabled", !connected);
    if (connected) {
        $("#conversation").show();
    }
    else {
        $("#conversation").hide();
    }
    $("#greetings").html("");
}

function connect() {
    var socket = new SockJS('/gs-guide-websocket'); //连接上端点(基站)
    stompClient = Stomp.over(socket); //用stom进行包装，规范协议
    stompClient.connect({}, function (frame) {
        setConnected(true);
        console.log('Connected: ' + frame);
        stompClient.subscribe('/topic/greetings', function (greeting) {
            showGreeting(JSON.parse(greeting.body).content);
        });
    });
}

function disconnect() {
    if (stompClient !== null) {
        stompClient.disconnect();
    }
    setConnected(false);
    console.log("Disconnected");
}

function sendName() {
    stompClient.send("/app/hello", {}, JSON.stringify({'name': $("#name").val()}));
}

function showGreeting(message) {
    $("#greetings").append("<tr><td>" + message + "</td></tr>");
}

$(function () {
    $("form").on('submit', function (e) {
        e.preventDefault();
    });
    $( "#connect" ).click(function() { connect(); });
    $( "#disconnect" ).click(function() { disconnect(); });
    $( "#send" ).click(function() { sendName(); });
});

启动项目后, 后台分别开两个圈口访问:localhost:8080/
在这里插入图片描述

Chay Wong
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
SpringBoot整合netty和websocket
Blog of Jatsby
12-12 362
构建netty服务器（如何构建请参考博主上两篇文章） 构建服务器后，用@Component注解该服务器类，让spring容器管理该服务器类，将该类定义成单例模式 @Component public class WSServer { private static class SingletonWSServer { static final WSServer instance ...
springBoot整合webSocket
程序员的专栏
03-03 3731
1、使用注解@ServerEndpoint注解webSocket @ServerEndpoint("/logWebSocket") public class LogWebSocketHandle { /** * 新的WebSocket请求开启 */ @OnOpen public void onOpen(Session session) { }
SpringBoot 集成 WebSocket
功不唐捐，玉汝于成
04-21 5646
SpringBoot 整合 websocket、websocket 的通信应用
SpringBoot整合WebSocket服务 springboot整合websocket springboot使用websocket springboot使用websocket
最新发布
半只
07-19 3476
仅使用 SpringBoot封装好的服务，并不是使用第三方Netty或者: 底层使用实现: 底层使用Netty实现(没有使用过，不知道具体)官方文档1官方文档2。
springboot整合webSocket（看完即入门）
热门推荐
qq_48721706的博客
05-27 9万+
webSocket1、什么是webSocket？2、webSocket可以用来做什么?3、webSocket协议4、服务端WebSocket操作类5、客户端 1、什么是webSocket？ WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。 2、webSocket可以用来做什么
Springboot WebSocket
weixin_45834664的博客
05-03 625
Springboot WebSocket @ServerEndpoint(“/ws/{userId}”) @ServerEndpoint(“/ws/{userId}”) @Component public class WebSocketServer { onlineCount private static int onlineCount = 0; ConcurrentHashMap private static ConcurrentHashMap<String,WebSocketServer>
springboot（十一）WebSocket实现前后端消息推送
南城老猫
03-26 6452
概述： WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket通信协议于2011年被IETF定为标准RFC 6455，并由RFC7936补充规范。WebSocketAPI也被W3C定为标准。 WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服...
SpringBoot整合WebSocket+nacos注册中心
01-07
通过这样的整合，SpringBoot项目不仅可以利用WebSocket提供实时通信能力，还可以借助Nacos实现服务的动态管理和通信，极大地提升了微服务架构的灵活性和可扩展性。在实际开发中，还需要考虑异常处理、性能优化以及与...
springboot-websocket:SpringBoot整合WebSocket
05-26
本项目"springboot-websocket"主要关注的是如何在SpringBoot应用中整合WebSocket，以实现实时推送或者双向通信的需求。以下将详细介绍整合过程中的关键知识点： 1. **WebSocket协议**：WebSocket协议是基于TCP的，...
SpringBoot+WebSocket--亲测可用
01-29
CSDN上的大部分我都下过了不能用，此SpringBoot 集成WebSocket ,亲测可用 支持jdk1.8,
SpringBoot整合websocket实现数据实时推送
08-29
2.SpringBoot如何集成websocket 3.SpringBoot中的定时任务调度 4.前后端分离项目的Cros跨域问题解决 阅读建议： 此资源以案例代入知识点的方式，让你快速上手websocket的相关学习，可针对项目本身向外扩展。
SpringBoot使用WebSocket
qq_43595018的博客
01-02 1万+
1、WebSocket是一种在单个TCP连接上进行全双工通信的协议。2、WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。3、在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。示例：WebSocket是一种双向网络通信协议，与HTTP不同，它以ws://或wss://开头。
Springboot整合WebSocket（纯后端）
从基础到源码解析的学习记录
04-26 4177
简单介绍下前端，不做代码方面内容。
2020-09-18
YvesHe的专栏
09-18 228
SpringBoot集成WebSocket 网上有很多关于WebSocket用法的文章，但是有一些内容错误或者代码不全的，这里来个全的，方便自己记忆。 前言： WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket通信协议于2011年被IETF定为标准RFC 6455，并由RFC7936补充规范。WebSocketAPI也被W3C定为标准。WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，..
SpringBoot集成WebSocket(实时消息推送)
总结分享
03-25 2647
WebSocket 允许服务器在没有收到请求的情况下主动向客户端发送数据，从而实现了更高效的实时通信。
springboot整合WebSocket
weixin_43757027的博客
04-27 1万+
springboot整合WebSocket WebSocket通信过程 客户端构建一个websocket实例，并且为它绑定一个需要连接到的服务器地址，当客户端连接服务端的候，会向服务端发送一个http get报文，告诉服务端需要将通信协议切换到websocket，服务端收到http请求后将通信协议切换到websocket,同时发给客户端一个响应报文，返回的状态码为101，表示同意客户端协议转请求，并转换为websocket协议。以上过程都是利用http通信完成的，称之为websocket协议握手(webs
SpringBoot整合WebSocket
小Y先生的博客
01-11 1万+
Springboot整合WebSocket
springboot整合 websocket
08-24
要实现Spring Boot整合WebSocket，你需要进行以下步骤： 1. 首先，在pom.xml文件中添加WebSocket的相关依赖。可以使用以下两个依赖之一： - 从中提到的依赖： ```xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency> ``` - 从中提到的依赖： ```xml <!--webSocket--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency> ``` 2. 创建WebSocket配置类，这个类负责配置WebSocket的相关信息。你可以按照以下方式创建一个配置类[3]： ```java package com.loit.park.common.websocket; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.socket.server.standard.ServerEndpointExporter; @Configuration public class WebSocketConfig { @Bean public ServerEndpointExporter serverEndpointExporter() { return new ServerEndpointExporter(); } } ``` 3. 至此，你已经完成了WebSocket的整合配置。现在，你可以在你的应用中创建WebSocket的控制器并定义你的WebSocket端点。你可以根据你的需求来实现WebSocket端点的业务逻辑。 这就是Spring Boot整合WebSocket的基本步骤。通过这种方式，你可以在Spring Boot应用中轻松地使用WebSocket进行实时通信。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [springboot整合websocket](https://blog.csdn.net/weixin_45390688/article/details/120448778)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [springboot整合websocket(详解、教程、代码)](https://blog.csdn.net/hjq_ku/article/details/127503180)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值