websocket 實現實時重新整理功能
阿新 • • 發佈:2018-11-08
<script> export default { data() { return { websock: null }; }, methods: { initWebSocket() { var backUrlarr = this.$store.state.baseUrl.split("/"), socketUrl = `${backUrlarr[2]}/${backUrlarr[3]}/websocket`; if (this.$store.state.baseUrl.indexOf("https") >= 0) { socketUrl = "wss://" + socketUrl; } else { socketUrl = "ws://" + socketUrl; } this.websock = new WebSocket(socketUrl); this.websock.onopen = this.websocketonopen; this.websock.onerror = this.websocketonerror; this.websock.onmessage = this.websocketonmessage; this.websock.onclose = this.websocketclose; }, websocketonopen() { console.log("WebSocket連線成功", new Date()); let self = this; setInterval(() => { console.log("傳送心跳"); let ping = { websocketType: "ping" }; self.websocketsend(JSON.stringify(ping)); }, 30000); }, websocketonerror(e) { console.log("WebSocket連線發生錯誤"); }, websocketonmessage(e) { //處理資料 const socketData = JSON.parse(e.data); }, websocketsend(agentData) { this.websock.send(agentData); }, websocketclose(e) { console.log("WebSocket連線關閉"); setTimeout(() => { this.initWebSocket(); console.log("socket正在重連..."); }, 500); } }, created() { this.initWebSocket(); }, destroyed() { this.websocketclose(); } }; </script>