一斤代碼深入理解系列《四》：微信小程序和服務(wù)器通信-WebSocket ... ...
接上一篇文章的話題，我們這次來講一下如何建立一個基于node.js的WebSocket服務(wù)器，并在小程序中使用這個提供實時服務(wù)的服務(wù)器。 node.js中已經(jīng)有很多現(xiàn)成的第三方庫，用于構(gòu)建WebSocket服務(wù)。我們今天選用一個叫做w ...
接上一篇文章的話題，我們這次來講一下如何建立一個基于node.js的WebSocket服務(wù)器，并在小程序中使用這個提供實時服務(wù)的服務(wù)器。
node.js中已經(jīng)有很多現(xiàn)成的第三方庫，用于構(gòu)建WebSocket服務(wù)。我們今天選用一個叫做websocket的庫，來構(gòu)建一個可以提供標(biāo)準(zhǔn)WebSocket接口的node.js服務(wù)端程序。
先建一個空文件夾，名叫ws-server，然后進入該文件夾，在命令行執(zhí)行:
npm install websocket
然后在ws-server文件夾下，再新建一個名為app.js的文件，內(nèi)容如下：
因為WebSocket服務(wù)是建立在HTTP之上的，所以我們看到，代碼中建立了一個http server, 然后建立了一個使用了該http server的WebSocket server，并讓http server監(jiān)聽8080端口對外提供服務(wù)。
這個服務(wù)端的功能也很簡單，就是收到客戶端發(fā)送的消息并打印出來，然后再接收到的消息前面加上一個[from server]的前綴后，返回給客戶端。
好，我們來實現(xiàn)調(diào)用該服務(wù)的微信小程序代碼：
首先我們需要用wx.connectSocket()方法去連接目標(biāo)服務(wù)器，因為我們開發(fā)環(huán)境用的是非安全的http，所以這邊的url參數(shù)是ws://打頭的，在以后微信的實際運行環(huán)境中，你的服務(wù)端必須使用SSL，所以連接url就會是wss://的了。
然后需要調(diào)用wx.onSocketOpen()方法來設(shè)置WebSocket連接打開時的回調(diào)函數(shù)。當(dāng)連接打開后，就可以開始向服務(wù)端發(fā)送數(shù)據(jù)了，我們在這里使用wx.sendSocketMessage()方法，向服務(wù)端發(fā)送了一個后面跟隨一個隨機數(shù)的Hello,World字符串。我們運行一下程序，可以看到，服務(wù)端的控制臺上會打印出這樣的結(jié)果：
說明服務(wù)端已經(jīng)成功接收到了客戶端發(fā)送的字符串消息。
之后服務(wù)端會向客戶端再反饋這個消息，那客戶端這邊如何接收這個從服務(wù)端過來的消息呢？我們可以在小程序中，使用wx.onSocketMessage()方法，監(jiān)聽服務(wù)端發(fā)送到客戶端的消息，正如我們上面的示例代碼寫的那樣：
wx.onSocketMessage(function (msg) {
console.log(msg)
})
這里在，我們在小程序的Console上，簡單的打印了從服務(wù)端過來的消息，如下所示：
這樣，一個簡單但完整的客戶端和服務(wù)器端的WebSocket交互就完成了。如果你想關(guān)閉這個WebSocket連接，那么你可以調(diào)用wx.closeSocket()來進行關(guān)閉。
好了，關(guān)于微信小程序和WebSocket服務(wù)器通信的例子，就講到這里吧。不對之處，歡迎指正。
