1. First contact with websocket, spend more than a day looking for relevant materials, and refer to relevant examples on the network( https://www.cnblogs.com/qilin-3611/p/7054270.html )A simple front-end and back-end demo is arranged. The back-end demo directly uses the demo of the article in the link. After downloading, tomcat is deployed above 8.0. The jdk is 1.8

Here is a simple front-end code:

<!-- readyState Indicates that the connection has four states:
CONNECTING (0): Indicates that the connection has not been established;
OPEN (1):  A connection has been established for communication;
CLOSING (2): Closing the connection by closing the handshake;
CLOSED (3): The connection is closed or cannot be opened; -->
<template>
  <div>
    <input type="text" v-model="text">
    <button @click="send()">send message</button>
    <br>
    <button @click="closeWebSocket()">Close websocket Connect</button>
    <br>
    <div>{{data}}</div>
  </div>
</template>
<script>
export default {
  name: "WebSocket",
  components: {

  },
  data() {
    return {
      text: '',
      data: '',
      websocket: null
    }
  },
  mounted() {
    if ('WebSocket' in window) {
      this.websocket = new WebSocket('ws://localhost:8080/JavaWebSocket/websocket')
      this.initWebSocket()
    } else {
      alert('Current browser Not support websocket')
    }
  },
  beforeDestroy() {
    this.onbeforeunload()
  },
  methods: {
    initWebSocket() {
      //Connection error
      this.websocket.onerror = this.setErrorMessage

      // //Connection successful
      this.websocket.onopen = this.setOnopenMessage

      //Callback of received message
      this.websocket.onmessage = this.setOnmessageMessage

      //Connection closed callback
      this.websocket.onclose = this.setOncloseMessage

      //Monitor the window closing event. When the window is closed, take the initiative to close the websocket connection to prevent closing the window before the connection is disconnected. The server will throw an exception.
      window.onbeforeunload = this.onbeforeunload
    },
    setErrorMessage() {
      this.data = "WebSocket Connection error" + '   Status code:' + this.websocket.readyState;
    },
    setOnopenMessage() {
      this.data = "WebSocket Connection successful" + '   Status code:' + this.websocket.readyState;
    },
    setOnmessageMessage(event) {
      this.data = 'Server returns:' + event.data;
    },
    setOncloseMessage() {
      this.data = "WebSocket Connection closed" + '   Status code:' + this.websocket.readyState;
    },
    onbeforeunload() {
      this.closeWebSocket();
    },

    //websocket sending message
    send() {
      this.websocket.send(this.text)
      this.text = ''
    },
    closeWebSocket() {
      this.websocket.close()
    }
  }
}

</script>
<style scoped>
</style>

The above code is opened by different browsers. After entering any text, the background will return the entered text to all the connected browsers. The demo is very simple. The purpose is to understand the simple concept and simple use of websocket, and further study the use of wss