1. 程式人生 > >原生nodejs編寫在線聊天系統

原生nodejs編寫在線聊天系統

get 決定 編碼 web 文件 資源 分享圖片 eat 如何

前端自動化由來已久,最近為了編寫自己的自動化工具,本人開始詳細學習node,為了檢驗學習成果,決定編寫一個類似於webqq的聊天系統。以下是該系統具有的模塊。

  • 登錄模塊(自動登錄)
  • 聊天模塊(私聊,群聊)
  • 統計模塊(一段時間內活躍的程度)
  • 地理模塊(查找附近)

本文主要講述如何用node.js編寫靜態資源服務器。

前期準備

既然要用node.js編寫,首先是下載、安裝最新版的node。

啟動服務

nodejs 啟動一個服務器的方法很簡單,就是調用node的原生模塊(http),調用其createServer方法即可。

const http = require(‘http‘);
const Until = require(‘./app/core/router‘);

global.BASE_DIR = __dirname;
global.VIEW = global.BASE_DIR + ‘/view/‘;

http.createServer((req, res) => { // 第一個參數為請求第二個參數為回應
    "use strict";
    Until.init(req.url, req).then(reslove => {
        if (!reslove) {
            return
        }
        res.writeHead(200, {‘Content-Type‘: reslove.type +‘; charset=utf-8‘}); // charset=utf-8 指定編碼方式
        res.end(reslove.response)
    })
}).listen(3000) 端口號

路由

當啟動服務之後,我們就要開始編寫整個系統的路由,系統的所有請求其實分為三類:一是請求前端頁面,二是請求靜態資源,三是請求數據。我們需要有一些標記來辨識請求以便合理處理。

    getRes(url) {
        "use strict";
        url = url.toString();
        if (url.includes(‘.html‘) || (!url.includes(‘.‘) && !url.includes(‘/api/‘))) { // 頁面
            return this.renderHtml();
        } else if (url.includes(‘/api/‘)) { // api
            return this.renderApi();
        } else if (url.includes(‘.‘)){
            return this.renderRrsource(); // 靜態資源
        }
    },

下面以登錄頁面為例來說明請求及響應過程。我們假定‘/login‘為登錄頁面的鏈接,當服務器收到請求時,需要做兩件事情,一是查找登錄的頁面,二是將頁面返回給前臺。

    // 檢測文件是否存在 存在則返回文件
    renderFile (filename, num){
        "use strict";
        let path_arr = [global.VIEW + filename + ‘.jade‘, global.BASE_DIR + filename] 
        return new Promise((reslove, reject) => {
            let path = path_arr[num], type;
            fs.access(path, (err) => { // 檢測文件是否存在
                if (err) {
                    reject(err);
                } else {
                    if (num == 0) { // 返回頁面
                        reslove({type: ‘text/html‘, response: jade.renderFile(path)})
                    } else { // 返回靜態資源
                        fs.readFile(path, (err, data)=> { 
                            if (err) {
                                reject(err)
                            } else {
                                if (path.includes(‘.css‘)) {
                                    type = ‘text/css‘
                                } else if (path.includes(‘.js‘)) {
                                    type = ‘application/x-javascript‘
                                }
                                reslove({type: type, response: data})
                            }
                        })
                    }

                }
            })
        })
    },

上面是請求資源和文件的邏輯,接口類似。完成效果:
技術分享圖片

原生nodejs編寫在線聊天系統