README 文档更新；websocket可以连上了

backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/WebSocketServer.java

@@ -10,7 +10,7 @@ import java.io.IOException;
 import java.util.concurrent.ConcurrentHashMap;
 import java.util.concurrent.CopyOnWriteArraySet;
 
-@ServerEndpoint("/websocket/{userId}")
+@ServerEndpoint("/access/websocket/{userId}")
 @Component
 @Slf4j
 public class WebSocketServer {

backend/microservice-provider-access-8002/src/main/resources/static/access/assets/js/websocket.js

@@ -0,0 +1,59 @@
+// window.wsUrl = 'ws://epp.only4.work/access/websocket/1';
+window.wsUrl = 'ws://127.0.0.1:80/access/websocket/1';
+window.wsUrl = 'ws://127.0.0.1:8002/access/websocket/1';
+// window.wsUrl = 'ws://127.0.0.1:8000';
+window.ws = null;
+
+(function () {
+    if (!'WebSocket' in window) {
+        alert("不支持当前浏览器，请升级浏览器。")
+        return
+    }
+
+    function createConn() {
+        // 创建webscoket 对象 地址填入本地ip 端口是在搭建websocket服务器定义的端口
+        const ws = new WebSocket(window.wsUrl)
+        // 执行上面的语句之后，客户端就会与服务器进行连接
+
+        // readyState返回当前实例对象的当前状态
+        /*
+          共有四种状态
+          CONNECTING: 值为0，表示正在连接
+          OPEN:  值为1，表示连接成功，可以通信了
+          CLOSING 值为2， 表示连接正在关闭
+          CLOSED 值为3，表示连接已经关闭了，或者打开连接失败
+        */
+
+        // 实例对象的onopen属性，用于指定连接成功后的回调函数
+        ws.onopen = (res) => {
+            console.log('onopen readyState', ws.readyState)
+            console.log('onopen 连接成功==========>', res)
+        }
+
+        // 实例对象的onmessage属性，用于指定收到服务器数据后的回调函数
+        ws.onmessage = ({data}) => {
+            console.log('onmessage readyState', ws.readyState)
+            // 注意此时的data是json格式的 需要转化下
+            console.log('onmessage 有新消息啦=======>', JSON.parse(data))
+            // 实例对象的send方法给服务器发送消息
+            ws.send('客户端发送的消息')
+        }
+
+        // 实例对象的onclose属性，用于连接关闭后的回调 函数
+        // 当关闭了服务器后 会走到此回调函数
+        ws.onclose = () => {
+            console.log('onclose readyState', ws.readyState)
+            console.log('onclose websocket连接关闭=======>')
+        }
+
+        // 连接发生错误的回调方法
+        // 如当服务器没有启动 就会走到这个错误回调
+        ws.onerror = (error) => {
+            console.log('onerror readyState', ws.readyState)
+            console.log('onerror 发生错误==========>', error)
+        }
+    }
+
+    createConn()
+
+})()

backend/microservice-provider-access-8002/src/main/resources/static/access/index.html

@@ -50,6 +50,7 @@
     </div>
     <script src="./renderer.js" type="module"></script>
     <script src="./assets/js/setting-panel.js" type="module"></script>
+    <script src="./assets/js/websocket.js"></script>
 </body>
 
 </html>