socket.io的使用(vue)

最近做了點新鮮玩意，使用socket.io進行一個pk答題的開發；功能大概就是兩個人在規定時間進行答題得分，越快回答分數越高；

使用這個需要服務端一起配合使用的哦，不然用不了的；我們開發的時候后端就花了好多時間搞這個，我也不知道為啥；

有個問題要說下，好像這個有版本問題，太高的版本，和服務端連接不起來。我們開發時用的版本是"socket.io": "2.3.0","socket.io-client": "2.3.0",

安裝：

npm install socket.io

引入：

import io from 'socket.io-client';

使用：

connect () {
    var opts = {
        query: {
            params1: value1,
            params2: value2,
            transport: 'websocket'
        },
        path: data.split('|')[1] // 后端返回的地址 https://test.crc.com|/socket-io1 'socket-io1'
    };
    this.socket = io(env[process.env.MODE].VUE_APP_SOCKET_URL, opts);
    // 進行socket連接
    this.socket.on('connect', () => {
        console.log("連接成功");
    });
    // 監聽socket推送事件 這里是后端給的事件名 'push_event'
    this.socket.on('push_event', (resData) => {
        try {
            // socket數據推送回來 做相應的處理
        } catch (err) {
            console.log('err', err)
        }
    });
    // 斷開socket連接
    this.socket.on('disconnect', () => {
        console.log("disconnect");
    });
    // socket連接錯誤
    this.socket.on('connect_error', (error) => {
        try {
            this.socket.close()
        } catch (err) {
            console.log('err', err)
        }
    });
    // 觸發嘗試重新連接
    this.socket.on('reconnect_attempt', () => {
        this.socket.io.opts.transports = ['websocket'];
    });
}
// 給服務端發送消息
send (data) {
    // 要發送的參數
    const sendData = {
        'id': '123',
        'data': {
            'matchId': this.opponentUserInfo.matchId+'', // 對局id
            'clientId': this.pkUserInfo.userId+'', //用戶玩家id
            'questionNum': this.serveReturnQuestionData.questionNum+'',//第幾題
            'option': data+'' // 選擇的選項
        }
    }
    // 'text'后端給的事件名 注意傳的參數要stringify下
    this.socket.emit('text',JSON.stringify(sendData));
}

附上文檔地址：socket.io 概述_w3cschool