相机ws链接

.env

@@ -1,2 +1,3 @@
 VITE_BASE_URL=http://192.168.1.111:8899
-VITE_WEBSOCKET_URL=ws://127.0.0.1:8899/websocket/nuclear
+VITE_WEBSOCKET_JAVA_URL=ws://127.0.0.1:8899/websocket/nuclear
+VITE_WEBSOCKET_CAMERA_URL=ws://127.0.0.1:8899/websocket/nuclear

src/components/Debug.vue

@@ -69,7 +69,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, onUnmounted } from 'vue'
 const simulation_brightness = ref(0)
 const brightness_1 = ref(0)
 const brightness_2 = ref(0)
@@ -77,8 +77,68 @@ const brightness_3 = ref(0)
 const brightness_4 = ref(0)
 const exposure = ref(0)
 
-onMounted(() => {
-  // 进入页面时链接ws，进行调试
+// 是否真正建立连接
+const lockReconnect = ref(false)
+// 断开 重连倒计时
+const timeoutnum = ref(null)
+
+const websock = ref(null)
+
+const reconnect = () => {
+  //重新连接
+  if (lockReconnect.value) {
+    return
+  }
+  lockReconnect.value = true
+  //没连接上会一直重连，设置延迟避免请求过多
+  timeoutnum.value && clearTimeout(timeoutnum.value)
+  timeoutnum.value = setTimeout(function () {
+    //新连接
+    initWebSocket()
+    lockReconnect.value = false
+  }, 5000)
+}
+
+// 接收到消息后改变状态
+const websocketonmessage = e => {
+  console.log(e.data)
+}
+
+const websocketonopen = () => {
+  console.log('客户端链接1！！！')
+}
+
+const websocketonerror = () => {
+  reconnect()
+}
+
+// 发送消息
+const websocketsend = data => {
+  websock.value.send(data)
+}
+
+const websocketclose = () => {
+  reconnect()
+}
+
+const initWebSocket = () => {
+  //初始化weosocket
+  const wsuri = import.meta.env.VITE_WEBSOCKET_CAMERA_URL
+  websock.value = new WebSocket(wsuri)
+  // 客户端接收服务端数据时触发
+  websock.value.onmessage = websocketonmessage
+  // 连接建立时触发
+  websock.value.onopen = websocketonopen
+  // 通信发生错误时触发
+  websock.value.onerror = websocketonerror
+  // 连接关闭时触发
+  websock.value.onclose = websocketclose
+}
+
+initWebSocket()
+
+onUnmounted(() => {
+  websock.value.close()
 })
 </script>
 

src/utils/websocket.js

@@ -4,7 +4,7 @@ class socket {
   }
   WebSocketSet(callBack) {
     if ('WebSocket' in window) {
-      this.ws = new WebSocket(`${import.meta.env.VITE_WEBSOCKET_URL}`)
+      this.ws = new WebSocket(`${import.meta.env.VITE_WEBSOCKET_JAVA_URL}`)
       this.ws.onopen = res => {
         console.log('socket连接成功')
       }