node.js - 微信小程序 +nodejs+socket.io bug
問題描述
技術(shù)nodejs
socket.io
微信小程序
源碼server.js
const app = require(’express’)()const http = require(’http’).Server(app)const io = require(’socket.io’)(http)app.use(function(req, res, next) { res.setHeader(’Access-Control-Allow-Origin’, ’*’) res.setHeader(’Access-Control-Allow-Credentials’, true) res.setHeader(’Access-Control-Allow-Methods’, ’POST, GET, PUT, DELETE, OPTIONS’) next()})app.get(’/’, (req, res, next) => { res.send({ code: 200, message: ’Welcome to Chat’ })})io.on(’connection’, socket => { console.log(’a user connected’) socket .broadcast .emit(’connection’, ’恭喜您, 您已經(jīng)連接上了我們的聊天室了, 現(xiàn)在您可以開始聊天了’) socket.on(’disconnect’, () => { console.log(’user disconnected’) }) socket.on(’chat message’, msg => { console.log(`message: ${msg}`) io.emit(’chat message’, msg) })})http.listen(3000, () => { console.log(’listening on *:3000’)})
client.js
onLoad(options) { // 頁面初始化 options為頁面跳轉(zhuǎn)所帶來的參數(shù) // 創(chuàng)建一個(gè) socket 連接 wx.connectSocket({ url: ’ws://localhost:3000’, data: {x: ’’,y: ’’ }, header: {’content-type’: ’application/json’ }, method: ’GET’, success: function (res) {console.log(’connect success: ’, res) }, fail: function (err) {console.log(’connect error: ’, err) } }) // 監(jiān)聽websocket打開事件 wx.onSocketOpen(function (res) { console.log(’WebSocket連接已經(jīng)打開!’) socketOpen = true for (var i = 0, len = socketMsgQueue.length; i < len; i++) {sendSocketMessage(socketMsgQueue[i]) } // 關(guān)閉socket wx.closeSocket() // socketMsgQueue = [] }) function sendSocketMessage(msg) { if (socketOpen) {wx.sendSocketMessage({data: msg}) } else {socketMsgQueue.push(msg) } } // 監(jiān)聽WebSocket錯(cuò)誤 wx .onSocketError(function (res) {console.log(’WebSocket連接打開失敗, 請(qǐng)檢查!’) }) // wx.sendSocketMessage 通過WebSocket連接發(fā)送數(shù)據(jù), 需要先先 wx.connectSocket, 并在 // wx.onSocketOpen 回調(diào)之后才能發(fā)送 監(jiān)聽WebSocket 接收到拂去其的消息事件 wx.onSocketMessage(function (res) { console.log(’收到服務(wù)器內(nèi)容: ’ + res.data) }) // 關(guān)閉WebSocket連接 監(jiān)聽websocket連接 wx.onSocketClose(function (res) { console.log(’WebSocket 已關(guān)閉!’) })BUG
WebSocket connection to ’ws://localhost:3000/’ failed: Connection closed before receiving a handshake response
為什么在握手前就斷開連接了?
已知的問題是:
微信小程序必須要 wss協(xié)議
在客戶端如果用 socket.io方式就可以,換成 html5的websocket 或 微信小程序內(nèi)置的socket方式 都不行(socket.io使用的是http協(xié)議)。
想知道的是:
微信小程序可以設(shè)置 socket以 http 協(xié)議請(qǐng)求嗎?或者有什么有得解決方法?
問題解答
回答1:微信小程序 websocket 協(xié)議版本為13 你可以抓包看下而 socket.io 支持的協(xié)議版本為4 socket.io-protocol
ws支持協(xié)議版本13 可以用ws包或者以他為依賴的中間件ws
相關(guān)文章:
1. 百度云加速正常 自己搭建的NGINX就出現(xiàn)400 本妹子求大神2. javascript - 微信音樂分享3. vue.js - vue+webpack+vue-router 部署到nginx服務(wù)器下,非根目錄,前后端怎樣配置文件?4. 在ios下 微信打開iframe鏈接的頁面時(shí) 在微信里長按無法識(shí)別二維碼5. javascript - 我寫的href跳轉(zhuǎn)地址不是百度,為什么在有的機(jī)型上跳轉(zhuǎn)到百度了,有的機(jī)型跳轉(zhuǎn)正確6. javascript - 按鈕鏈接到另一個(gè)網(wǎng)址 怎么通過百度統(tǒng)計(jì)計(jì)算按鈕的點(diǎn)擊數(shù)量7. html5 - H5移動(dòng)端UC瀏覽器的,跳轉(zhuǎn)下一個(gè)頁面,下一個(gè)頁面input輸入框獲取焦點(diǎn)后,會(huì)帶出上一頁的內(nèi)容?8. vue.js - vue apache 代理設(shè)置9. CSS3動(dòng)畫的硬件加速的問題。。10. nginx - 關(guān)于vue項(xiàng)目部署到ngnix后出現(xiàn)的問題
