websocket浅谈

1、怎么搭建一个简易的websocket架子,让前端后端用来交互?

我们采用引入三方jar的方式进行搭建,需要的jar如下:

复制代码
       <dependency>
            <groupId>org.atmosphere</groupId>
            <artifactId>atmosphere-runtime</artifactId>
        </dependency>

        <dependency>
            <groupId>javax.inject</groupId>
            <artifactId>javax.inject</artifactId>
        </dependency>

需要再web,xml里面进行配置一个servlet

复制代码
    <servlet>
        <description>AtmosphereServlet</description>
        <servlet-name>AtmosphereServlet</servlet-name>
        <servlet-class>org.atmosphere.cpr.AtmosphereServlet</servlet-class>
        <init-param>
            <param-name>org.atmosphere.cpr.packages</param-name>
            <param-value>具体的包的目录</param-value>
        </init-param>
        <load-on-startup>0</load-on-startup>
        <async-supported>true</async-supported>
    </servlet>
    <servlet-mapping>
        <servlet-name>AtmosphereServlet</servlet-name>
        <url-pattern>/websocket/*</url-pattern>
    </servlet-mapping>

前端需要引入 atmosphere.js

前端可以封装一个简易的调用

复制代码
html:

<input id="send" type="input">
<input type="button" onclick="send()" value="发送">
<span id="sendvalue"></span>




js:

var request={
            url:'http://localhost:8082/工程名称/websocket/test',
            contentType:"application/json",
            transport:"websocket",
            fallbackTransport:"long-polling",
            onTransportFailure: function(errorMsg, request) {
                request.fallbackTransport = "long-polling";
                transport = "long-polling";
            },
            onMessage:function(response) {
                var msgStr = response.responseBody;
                $("#sendvalue").text(msgStr);
                }


        }
        var subSocket=atmosphere.subscribe(request);


        function send(){
            var send=$('#send').val();
            subSocket.push(send);
        }

后端接收代码

复制代码
import lombok.extern.slf4j.Slf4j;
import org.atmosphere.config.service.Disconnect;
import org.atmosphere.config.service.ManagedService;
import org.atmosphere.config.service.Message;
import org.atmosphere.config.service.Ready;
import org.atmosphere.cpr.Broadcaster;

import javax.inject.Inject;
import javax.inject.Named;

@Slf4j
@ManagedService(path = "websocket/test")
public class WebsocketTest {


    @Inject
    @Named("websocket/test")
    private static Broadcaster broadcaster;

    @Ready
    public void onReady() {
        log.info("onReady"); //准备
    }

    @Disconnect
    public void onDisconnect() {
        log.info("onDisconnect"); //销毁
    }

    @Message
    public void onMessage(String message) {
        log.info("onMessage");
        broadcaster.broadcast(message);  //发送给前端
    }
}
相关推荐
BlockWay2 小时前
WEEX WebSocket 与 API 生态,正在解决什么问题?
网络·websocket·网络协议
俊俊谢2 小时前
【python】FastAPI 实时推送:从 SSE 到 WebSocket
python·websocket·fastapi
TickDB3 小时前
统一行情 API 查 A 股、港股、美股和数字货币:code=0 不代表 symbol 一个没少
人工智能·python·websocket·mcp·行情数据 api
晓杰'17 小时前
从0到1实现Balatro游戏后端(8):Skip Blind与Tag奖励机制设计与实现
后端·websocket·typescript·项目实战·nestjs·状态管理·游戏服务器
CryptoPP1 天前
多市场行情 API 接入实战:一套接口打通股票/外汇/期货/加密货币 + WebSocket 实时推送
大数据·网络·人工智能·websocket·网络协议·金融·区块链
Zhan8611242 天前
深夜调试法国行情数据API接口的教训:法国CAC40指数WebSocket接入复盘
websocket·网络协议·php
TickDB3 天前
Python 调用实时行情 API:ticker 返回成功后,如何校验字段再入库或展示
python·websocket·行情数据 api
The_Ticker3 天前
港股量化实测:实时行情接口性能与数据质量深度解析
python·websocket·算法·金融
xujinwei_gingko3 天前
SpringBoot整合WebSocket
spring boot·后端·websocket
天天进步20154 天前
Tunnelto 源码解析 #9:控制服务器设计:Warp、WebSocket、Ping/Pong 与连接保活
运维·服务器·websocket