首页 > 基础资料 博客日记

Java WebSocket的使用(有代码案例)

2024-08-18 14:00:06基础资料围观174

这篇文章介绍了Java WebSocket的使用(有代码案例),分享给大家做个参考,收藏Java资料网收获更多编程知识

什么是WebSocket

WebSocket是一种在Web开发中用于实现双向双向通信的协议。
它允许在客户端和服务器之间建立持久性的连接,使得数据可以在双方之间进行实时交换,而不需要客户端发起多个HTTP请求

WebSocket的特点:

  1. 双向通信

webSocke允许客户端和服务器之间双向实时通信,客户端可以向服务器发送消息,服务器也可以向客户端发送消息。

  1. 持久连接

webSocket连接是持久性的,一旦建立连接,他会保持打开状态,直到其中一方主动关闭连接

  1. 低延迟

    webSocket使用单个TCP连接进行通信,相比多次HTTP请求-响应循环,具有更低的通信延迟

  2. 轻量级

    webSocket协议相对简单,通信数据头部较小,减少了通信的额外开销

webSocket和HTTP的区别

  1. 通信模式

HTTP是一种无状态的请求-响应协议,客户端向服务器发送请求,服务器处理请求并返回响应,然后连接立即关闭。每个请求都是独立的,不会保持连接状态
WebSocket允许在客户端和服务器之间建立持久性的双向连接,客户端和服务器可以通过这个连接实时的交换数据。客户端和服务器都可以同时发送和接收数据

  1. 连接性

HTTP协议是基于请求-响应模式的,每次请求都需要客户端发起新的连接,并在收到响应后关闭
WebSocket允许客户端和服务器之间建立持久性连接,连接建立之后可以一直保持打开状态,直到其中一方主动关闭连接或者发生错误

  1. 数据格式

HTTP协议通常用于传输文档、图像、视频等静态资源或者动态资源,数据格式通常是文本或者是二进制,但是在每次请求和响应中都需要携带HTTP的头部信息
webSocket协议支持传输文本或二进制数据,数据格式更加灵活,可以根据应用程序的需要自定义

  1. 性能和效率

HTTP协议在每次请求-响应周期中都需要消耗额外的资源来建立和关闭连接,通信效率相对较低
webSocket通过在客户端和服务器之间建立持久连接,减少建立和关闭的开销,通信效率更高,延迟更低

webSocket的常用常见

在线聊天、股票行情、在线投票和调查,实时地图和位置等

怎么用WebSocket

前端(Vue)

<template>
  <div>
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-input v-model="form.message" type="text"></el-input>
      <el-button type="success" @click="send">发送消息</el-button>
      <el-button type="danger" @click="close">关闭连接</el-button>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  data() {
    return {
      clientId: null,
      form: { message: "" },
      rules: {},
      path: null,
      socket: "",
    };
  },
  mounted() {
    //进行初始化操作
    this.init();
  },
  methods: {
    init() {
      //判断浏览器是否支持webSocket
      if (typeof WebSocket === "undefined") {
        alert("您的浏览器不支持socket");
      } else {
        //clientId是表示哪个客户端
        this.clientId = Math.random().toString(36).substring(2);
        console.log("clientId", this.clientId);
        //初始化webSocket的地址
        this.path = "ws://127.0.0.1:9140/ws/" + this.clientId;
        //创建webSocket对象
        this.socket = new WebSocket(this.path);
        this.socket.onopen = this.open();
        this.socket.onerror = this.error();
        this.socket.onmessage = this.getMessage();
      }
    },

    open() {
      console.log("socket连接成功");
    },
    error() {
      console.log("socket连接错误");
    },
    getMessage() {
      console.log(this.form.message);
    },
    close() {
      console.log("socket已经关闭");
    },
    send() {
      this.socket.send(this.form.message);
    },
  },
  destroyed() {
    //销毁监听
    this.socket.onclose = this.close;
  },
};
</script>
<style scoped>
</style>

后端(Java)

  1. 添加依赖(自己选择版本,我用的版本是这个)
    <!--websocket-->
    <dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-websocket</artifactId>
      <version>2.1.8.RELEASE</version>
    </dependency>
  1. 创建注册WebSocket的服务组件
/**
 * 注册web Socket的服务组件
 */
@Configuration
public class WebSocketConfiguration {


    @Bean
    public ServerEndpointExporter serverEndpointExporter(){
        return new ServerEndpointExporter();
    }
}


  1. 通信服务
/**
 *  导入web Socket服务端组件web Socket Server用于和客户端通信
 */
@Component
@ServerEndpoint("/ws/{clientId}")
public class WebSocketServer {

    private static Map<String, Session> sessionMap = new HashMap<>();


    @OnOpen
    public void opOpen(Session session, @PathParam("clientId") String clientId) {
        System.err.println("客户端:" + clientId + "建立连结");
        sessionMap.put(clientId, session);
    }

    @OnClose
    public void onClose(@PathParam("clientId") String clientId) {
        sessionMap.remove(clientId);
    }

    /**
     * 收到客户端消息后调用的方法
     *
     * @param message  客户端发送过来的消息
     * @param clientId
     */
    @OnMessage
    public void onMessage(String message, @PathParam("clientId") String clientId) {
        System.err.println("收到来自客户端" + clientId + "的消息:" + message);
    }


    public void sendToAllClient(String message) {
        Collection<Session> sessions = sessionMap.values();
        for (Session session : sessions
        ) {
            try {
                session.getBasicRemote().sendText(message);
            } catch (Exception e) {
                e.printStackTrace();
            }

        }
    }


}

  1. 服务端定时发送消息

注意如果用了定时器需要在启动类加上@EnableScheduling注解,否则定时任务不生效

@Component
public class WebSocketTask {

    @Autowired
    private WebSocketServer webSocketServer;


    /**
     * 通过WebSocket每隔5秒向客户端发送消息
     */
    @Scheduled(cron = "0/5 * * * * ?")
    public void sendMessageToClient(){
        System.err.println(LocalDateTime.now());
        webSocketServer.sendToAllClient("这是来自服务端的消息:"+ DateTimeFormatter.ofPattern("HH:mm:ss").format(LocalDateTime.now()));
    }
}

文章来源:https://blog.csdn.net/qq_61679345/article/details/138614847
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:jacktools123@163.com进行投诉反馈,一经查实,立即删除!

标签:

相关文章

本站推荐

标签云