小程序模板網(wǎng)

【mangosuch 】小程序server-3-搭建WebSocket 服務(wù)

發(fā)布時(shí)間:2017-12-26 12:01 所屬欄目:小程序開發(fā)教程

1.安裝 Node 模塊使用 ws 模塊來(lái)在服務(wù)器上支持 WebSocket 協(xié)議,下面使用 NPM 來(lái)安裝:cd /var/www/wxpro npm install ws --save2.實(shí)現(xiàn) WebSocket 服務(wù)器創(chuàng)建 websocket.js,實(shí)現(xiàn) WebSocket 服務(wù)// 引入 ws 支持 We ...

 
 
 

1.安裝 Node 模塊

使用 ws 模塊來(lái)在服務(wù)器上支持 WebSocket 協(xié)議,下面使用 NPM 來(lái)安裝:

cd /var/www/wxpro
npm install ws --save

2.實(shí)現(xiàn) WebSocket 服務(wù)器

創(chuàng)建 websocket.js,實(shí)現(xiàn) WebSocket 服務(wù)

// 引入 ws 支持 WebSocket 的實(shí)現(xiàn)
const ws = require('ws');

// 導(dǎo)出處理方法
exports.listen = listen;

/**
 * 在 HTTP Server 上處理 WebSocket 請(qǐng)求
 * @param {http.Server} server
 * @param {wafer.SessionMiddleware} sessionMiddleware
 */
function listen(server, sessionMiddleware) {
    // 使用 HTTP Server 創(chuàng)建 WebSocket 服務(wù),使用 path 參數(shù)指定需要升級(jí)為 WebSocket 的路徑
    const wss = new ws.Server({ server, path: '/ws' });

    // 監(jiān)聽 WebSocket 連接建立
    wss.on('connection', (ws,request) => {// 要升級(jí)到 WebSocket 協(xié)議的 HTTP 連接

        // 被升級(jí)到 WebSocket 的請(qǐng)求不會(huì)被 express 處理,
        // 需要使用會(huì)話中間節(jié)獲取會(huì)話
        sessionMiddleware(request, null, () => {
            const session = request.session;
            if (!session) {
                // 沒有獲取到會(huì)話,強(qiáng)制斷開 WebSocket 連接
                ws.send(JSON.stringify(request.sessionError) || "No session avaliable");
                ws.close();
                return;
            }
            // 保留這個(gè)日志的輸出可讓實(shí)驗(yàn)室能檢查到當(dāng)前步驟是否完成
            console.log(`WebSocket client connected with openId=${session.userInfo.openId}`);
            serveMessage(ws, session.userInfo);
        });
    });

    // 監(jiān)聽 WebSocket 服務(wù)的錯(cuò)誤
    wss.on('error', (err) => {
        console.log(err);
    });
}

/**
 * 進(jìn)行簡(jiǎn)單的 WebSocket 服務(wù),對(duì)于客戶端發(fā)來(lái)的所有消息都回復(fù)回去
 */
function serveMessage(ws, userInfo) {
    // 監(jiān)聽客戶端發(fā)來(lái)的消息
    ws.on('message', (message) => {
        console.log(`WebSocket received: ${message}`);
        ws.send(`Server: Received(${message})`);
    });

    // 監(jiān)聽關(guān)閉事件
    ws.on('close', (code, message) => {
        console.log(`WebSocket client closed (code: ${code}, message: ${message || 'none'})`);
    });

    // 連接后馬上發(fā)送 hello 消息給會(huì)話對(duì)應(yīng)的用戶
    ws.send(`Server: 恭喜,${userInfo.nickName}`);
}

編輯 app.js,調(diào)用 WebSocket 服務(wù)

// HTTP 模塊同時(shí)支持 Express 和 WebSocket
const http = require('http'); 
// 引用 express 來(lái)支持 HTTP Server 的實(shí)現(xiàn)
const express = require('express');
// 引用 wafer-session 支持小程序會(huì)話
const waferSession = require('wafer-node-session'); 
// 使用 MongoDB 作為會(huì)話的存儲(chǔ)
const MongoStore = require('connect-mongo')(waferSession); 
// 引入配置文件
const config = require('./config'); 
// 引入 WebSocket 服務(wù)實(shí)現(xiàn)
const websocket = require('./websocket');

// 創(chuàng)建一個(gè) express 實(shí)例
const app = express();

// 獨(dú)立出會(huì)話中間件給 express 和 ws 使用
const sessionMiddleware = waferSession({
    appId: config.appId,
    appSecret: config.appSecret,
    loginPath: '/login',
    store: new MongoStore({
        url: `mongodb://${config.mongoUser}:${config.mongoPass}@${config.mongoHost}:${config.mongoPort}/${config.mongoDb}`
    })
});
app.use(sessionMiddleware);

// 在路由 /me 下,輸出會(huì)話里包含的用戶信息
app.use('/me', (request, response, next) => { 
    response.json(request.session ? request.session.userInfo : { noBody: true }); 
    if (request.session) {
        console.log(`Wafer session success with openId=${request.session.userInfo.openId}`);
    }
}); 

// 實(shí)現(xiàn)一個(gè)中間件,對(duì)于未處理的請(qǐng)求,都輸出 "Response from express"
app.use((request, response, next) => {
    response.write('Response from express');
    response.end();
});

// 創(chuàng)建 HTTP Server 而不是直接使用 express 監(jiān)聽
const server = http.createServer(app);

// 讓 WebSocket 服務(wù)在創(chuàng)建的 HTTP 服務(wù)器上監(jiān)聽
websocket.listen(server, sessionMiddleware);

// 啟動(dòng) HTTP 服務(wù)
server.listen(config.serverPort);

// 輸出服務(wù)器啟動(dòng)日志
console.log(`Server listening at http://127.0.0.1:${config.serverPort}`);

3.編輯 Nginx 配置 ssl.conf,添加 WebSocket 支持

#WebSocket 配置
map $http_upgrade $connection_upgrade {
    default upgrade;
    ''      close;
}

server {
        listen 443;
        server_name www.example.com; # 改為綁定證書的域名
        #ssl 配置
        ssl on;
        ssl_certificate 1_www.example.com.crt; # 改為自己申請(qǐng)得到的 crt 文件的名稱
        ssl_certificate_key 2_www.example.com.key; # 改為自己申請(qǐng)得到的 key 文件的名稱
        ssl_session_timeout 5m;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers on;

        #WebSocket 配置
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection $connection_upgrade;

        location / {
            proxy_pass http://127.0.0.1:8765;
        }
    }
nginx -t
nginx -s reload


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉(cāng)庫(kù):starfork
本文地址:http://m.u-renovate.com/wxmini/doc/course/18258.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢
AI智能客服 ×