猿问

我在vue中使用了这个示例的代码创建websocket,但是经常在刷新的事情出现错误

vue 如何使用websocket

<script>

    export default {

        data() {

            return {

                websock: null,

            }

        },

        methods: {

            threadPoxi(){  // 实际调用的方法

                //参数

                const agentData = "mymessage";

                //若是ws开启状态

                if (this.websock.readyState === this.websock.OPEN) {

                    this.websocketsend(agentData)

                }

                // 若是 正在开启状态,则等待300毫秒

                else if (this.websock.readyState === this.websock.CONNECTING) {

                    let that = this;//保存当前对象this

                    setTimeout(function () {

                        that.websocketsend(agentData)

                    }, 300);

                }

                // 若未开启 ,则等待500毫秒

                else {

                    this.initWebSocket();

                    let that = this;//保存当前对象this

                    setTimeout(function () {

                        that.websocketsend(agentData)

                    }, 500);

                }

            },

            initWebSocket(){ //初始化weosocket

                //ws地址

                const wsuri = process.env.WS_API + "/websocket/threadsocket";

                this.websock = new WebSocket(wsuri);

                this.websock.onmessage = this.websocketonmessage;

                this.websock.onclose = this.websocketclose;

            },

            websocketonmessage(e){ //数据接收

                const redata = JSON.parse(e.data);

                console.log(redata.value);

            },

            websocketsend(agentData){//数据发送

                this.websock.send(agentData);

            },

            websocketclose(e){  //关闭

                console.log("connection closed (" + e.code + ")");

            }


我在网上看到这篇文章介绍如何在vue中使用websocket,使用他的代码,能够成功创建websocket服务,但是经常会出现在刷新页面的时候报错如下错误

Uncaught DOMException: Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.

我猜测是这一段setTimeout()执行的时候readyState依然没有打开的状态,我试着把时间设置长一点好像出现的概率小了很多,但是这似乎不是一个好的解决方案

https://img4.mukewang.com/5ca41f1c0001703705460269.jpg

qq_花开花谢_0
浏览 3149回答 1
1回答
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答