了解NodeJS看這一篇就夠了

untn9315 6年前發布 | 33K 次閱讀 Node.js Node.js 開發

摘要:這篇文章適合對Node一無所知或了解不多的初學者閱讀。全面但不深入地講了包括http模塊、express、mongodb和RESTful API等知識點。

如果你是前端開發工作者,那么對你來說,基于NodeJS編寫web程序已經不是什么新聞了。而不管是NodeJS還是web程序都非常依賴JavaScript這門語言。

首先,我們要認識到一點:Node并不是銀彈。也就是說,它不是所有項目的最佳解決方案。任何人都可以基于Node創建一個服務器,但是這需要你對編寫web程序的語言具有一定程序的有很深入的理解。

最近,我從學習Node的過程中發現了許多樂趣,同時我也意識到我已經掌握了一定的知識,應該分享出來,并且從社區獲得反饋來提升自己。

那么就讓我們開始吧。

Node.js出現之前

在Node.js出現之前,web應用往往基于客戶端/服務器模式,當客戶端向服務器請求資源時,服務器會響應這個請求并且返回相應的資源。服務器只會在接收到客戶端請求時才會做出響應,同時會在響應結束后關閉與客戶端的連接。

這種設計模式需要考慮到效率問題,因為每一個請求都需要處理時間和資源。因此,服務器在每一次處理請求的資源后應該關閉這個連接,以便于響應其他請求。

如果同時有成千上萬個請求同時發往服務器,服務器會變成什么樣子呢?當你問出這個問題時,你一定不想看到一個請求必須等待其他請求被響應后才能輪到他的情形,因為這段延遲實在是太長了。

想象一下,當你想要打開非死book,但因為在你之前已經有上千人向服務器發出過請求,所以你需要等待5分鐘才能看到內容。有沒有一種解決方案來同時處理成百上千個請求呢?所幸我們有線程這個工具。

線程是系統能夠并行處理多任務所使用的方式。每一個發給服務器的請求都會開啟一個新的線程,而每個線程會獲取它運行代碼所需要的一切。

這聽上去很奇怪?讓我們來看看這個例子:

想象餐館里只有一個廚師提供食物,當食物需求越來越多,事情也會變得越來越糟。在之前的所有訂單都被處理前,人們不得不等待很長時間。而我們能想到的方法就是增加更多的服務員來解決這個問題,對吧?這樣能夠同時應付更多的顧客。

每一個線程都是一個新的服務員,而顧客就是瀏覽器。我想理解這一點對你來說并不困難。

但是這種系統有一個副作用,讓請求數達到一定數量時,過多的線程會占用所有系統內存和資源。重新回到我們的例子里,雇傭越來越多的人來供應食物必然會提高人力成本和占用更多的廚房空間。

當然,如果服務器在響應完客戶端的請求后立刻切斷連接并釋放所有資源,這對我們來說自然是極好的。

多線程系統擅長于處理CPU密集型操作,因為這些操作需要處理大量的邏輯,而且計算這些邏輯會花費更多的時間。如果每一個請求都會被一個新的線程處理,那么主線程可以被解放出來去處理一些重要的計算,這樣也能讓整個系統變得更快。

讓主線程不必忙于所有的運算操作是一種提高效率的好辦法,但是能不能在此之上更進一步呢?

NodeJS來了

想象一下我們現在已經有了一個多線程服務器,運行于Ruby on rails環境。我們需要它讀取文件并且發送給請求這個文件的瀏覽器。首先要知道的是Ruby并不會直接讀取文件,而是通知文件系統去讀取指定文件并返回它內容。顧名思義,文件系統就是計算機上一個專門用來存取文件的程序。

Ruby在向文件系統發出通知后會一直等待它完成讀取文件的操作,而不是轉頭去處理其他任務。當文件系統處理任務完成后,Ruby才會重新啟動去收集文件內容并且發送給瀏覽器。

這種方式很顯然會造成阻塞的情況,而NodeJS的誕生就是為了解決這個痛點。如果我們使用Node來向文件系統發出通知,在文件系統去讀取文件的這段時間里,Node會去處理其他請求。而讀取文件的任務完成后,文件系統會通知Node去讀取資源然后將它返回給瀏覽器。事實上,這里的內部實現都是依賴于Node的事件循環。

Node的核心就是JavaScript和事件循環。

簡單地說,事件循環就是一個等待事件然后在需要事件發生時去觸發它們的程序。此外還有一點很重要,就是Node和JavaScript一樣都是單線程的。

還記得我們舉過的餐廳例子嗎?不管顧客數量有多少,Node開的餐廳里永遠只有一個廚師烹飪食物。

與其他語言不同,NodeJS不需要為每一個請求開啟一個新的線程,它會接收所有請求,然后將大部分任務委托給其他的系統。 Libuv 就是一個依賴于OS內核去高效處理這些任務的庫。當這些隱藏于幕后的工作者處理完委托給它們的事件后,它們會觸發綁定在這些事件上的回調函數去通知NodeJS。

這兒我們接觸到了回調這個概念。回調理解起來并不困難,它是被其他函數當作參數傳遞的函數,并且在某種特定情況下會被調用。

NodeJS開發者們做的最多的就是編寫事件處理函數,而這些處理函數會在特定的NodeJS事件發生后被調用。

NodeJS雖然是單線程,但它比多線程系統要快得多。這是因為程序往往并不是只有耗時巨長的數學運算和邏輯處理,大部分時間里它們只是寫入文件、處理網絡請求或是向控制臺和外部設備申請權限。這些都是NodeJS擅長處理的問題:當NodeJS在處理這些事情時,它會迅速將這些事件委托給專門的系統,轉而去處理下一個事件。

如果你繼續深入下去,你也許會意識到NodeJS并不擅長處理消耗CPU的操作。因為CPU密集型操作會占用大量的主線程資源。對于單線程系統來說,最理想的情況就是避免這些操作來釋放主線程去處理別的事情。

還有一個關鍵點是在JavaScript中,只有你寫的代碼不是并發執行的。也就是說,你的代碼每次只能處理一件事,而其他工作者,比如文件系統可以并行處理它們手頭的工作。

如果你還不能理解的話,可以看看下面的例子:

很久以前有一個國王,他有一千個官員。國王寫了一個任務清單讓官員去做,清單非常非常非常長。有一個宰相,根據清單將任務委托給其他所有官員。每完成一項任務他就將結果報告給國王,之后國王又會給他另一份清單。因為在官員工作的時候,國王也在忙于寫其他清單。

這個例子要講的是即使有很多官員在并行處理任務,國王每次也只能做一件事。這里,國王就是你的代碼,而官員就是藏于NodeJS幕后的系統工作者。所以說,除了你的代碼,每件事都是并行發生的。

好了,讓我們繼續這段NodeJS之旅吧。

用NodeJS寫一個web應用

用NodeJS寫一個web應用相當于編寫事件回調。讓我們來看看下面的例子:

  1. 新建并進入一個文件夾
  2. 執行 npm init 命令,一直回車直到你在文件夾根目錄下創建了一個package.json文件。
  3. 新建一個名為server.js的文件,復制并粘貼下面的代碼:

    //server.js
    const http = require('http'),
          server = http.createServer();
    
    server.on('request',(request,response)=>{
       response.writeHead(200,{'Content-Type':'text/plain'});
       response.write('Hello world');
       response.end();
    });
    
    server.listen(3000,()=>{
      console.log('Node server created at port 3000');
    });
  4. 在命令行中,輸入 node server.js ,你會看到下面的輸出:

    node server.js
    //Node server started at port 3000

    打開瀏覽器并且進入 localhost:3000 ,你應該能夠看到一個 Hello world 信息。

首先,我們引入了http模塊。這個模塊提供了處理htpp操作的接口,我們調用 createServer() 方法來創建一個服務器。

之后,我們為request事件綁定了一個事件回調,傳遞給on方法的第二個參數。這個回調函數有2個參數對象,request代表接收到的請求,response代表響應的數據。

不僅僅是處理request事件,我們也可以讓Node去做其他事情。

//server.js
const http = require('http'),
server = http.createServer((request,response)=>{
    response.writeHead(200,{'Content-Type':'text/plain'});
    response.write('Hello world');
    response.end();
});
server.listen(3000,()=>{
    console.log('Node server created at port 3000');
});

在當面的代碼里,我們傳給createServer()一個回調函數,Node把它綁定在request事件上。這樣我們只需要關心request和response對象了。

我們使用 response.writeHead() 來設置返回報文頭部字段,比如狀態碼和內容類型。而 response.write() 是對web頁面進行寫入操作。最后使用 response.end() 來結束這個響應。

最后,我們告知服務器去監聽3000端口,這樣我們可以在本地開發時查看我們web應用的一個demo。listen這個方法要求第二個參數是一個回調函數,服務器一啟動,這個回調函數就會被執行。

習慣回調

Node是一個單線程事件驅動的運行環境,也就是說,在Node里,任何事都是對事件的響應。

前文的例子可以改寫成下面這樣:

//server.js
const http = require('http'),

makeServer = function (request,response){
   response.writeHead(200,{'Content-Type':'text/plain'});
   response.write('Hello world');
   response.end();
},

server = http.createServer(makeServer);

server.listen(3000,()=>{
  console.log('Node server created at port 3000');

makeServer 是一個回調函數,由于JavaScript把函數當作一等公民,所以他們可以被傳給任何變量或是函數。如果你還不了解JavaScript,你應該花點時間去了解什么是事件驅動程序。

當你開始編寫一些重要的JavaScript代碼時,你可能會遇到“回調地獄”。你的代碼變得難以閱讀因為大量的函數交織在一起,錯綜復雜。這時你想要找到一種更先進、有效的方法來取代回調。看看Promise吧, Eric Elliott 寫了一篇文章來 講解什么是Promise ,這是一個好的入門教程。

NodeJS路由

一個服務器會存儲大量的文件。當瀏覽器發送請求時,會告知服務器他們需要的文件,而服務器會將相應的文件返回給客戶端。這就叫做路由。

在NodeJS中,我們需要手動定義自己的路由。這并不麻煩,看看下面這個基本的例子:

//server.js
const http = require('http'),
      url = require('url'),

makeServer = function (request,response){
   let path = url.parse(request.url).pathname;
   console.log(path);
   if(path === '/'){
      response.writeHead(200,{'Content-Type':'text/plain'});
      response.write('Hello world');
   }
   else if(path === '/about'){
     response.writeHead(200,{'Content-Type':'text/plain'});
     response.write('About page');
   }
   else if(path === '/blog'){
     response.writeHead(200,{'Content-Type':'text/plain'});
     response.write('Blog page');
   }
   else{
     response.writeHead(404,{'Content-Type':'text/plain'});
     response.write('Error page');
   }
   response.end();
 },
server = http.createServer(makeServer);
server.listen(3000,()=>{
 console.log('Node server created at port 3000');
});

粘貼這段代碼,輸入 node server.js 命令來運行。在瀏覽器中打開 localhost:3000 和 localhost:3000/abou ,然后在試試打開 localhost:3000/somethingelse ,是不是跳轉到了我們的錯誤頁面?

雖然這樣滿足了我們啟動服務器的基本要求,但是要為服務器上每一個網頁都寫一遍代碼實在是太瘋狂了。事實上沒有人會這么做,這個例子只是讓你了解路由是怎么工作的。

如果你有注意到,我們引入了url這個模塊,它能讓我們處理url更加方便。

為parse()方法傳入一個url字符串參數,這個方法會將url拆分成 protocol 、 host 、 path 和 querystring 等部分。如果你不太了解這些單詞,可以看看下面這張圖:

所以當我們執行 url.parse(request.url).pathname 語句時,我們得到一個url路徑名,或者是url本身。這些都是我們用來進行路由請求的必要條件。不過這件事還有個更簡單的方法。

使用Express進行路由

如果你之前做過功課,你一定聽說過Express。這是一個用來構建web應用以及API的NodeJS框架,它也可以用來編寫NodeJS應用。接著往下看,你會明白為什么我說它讓一切變得更簡單。

在你的終端或是命令行中,進入電腦的根目錄,輸入 npm install express --save 來安裝Express模塊包。要在項目中使用Express,我們需要引入它。

const express = require('express');

歡呼吧,生活將變得更美好。

現在,讓我們用express進行基本的路由。

//server.js
const express = require('express'),
      server = express();

server.set('port', process.env.PORT || 3000);

//Basic routes
server.get('/', (request,response)=>{
   response.send('Home page');
});

server.get('/about',(request,response)=>{
   response.send('About page');
});

//Express error handling middleware
server.use((request,response)=>{
   response.type('text/plain');
   response.status(505);
   response.send('Error page');
});

//Binding to a port
server.listen(3000, ()=>{
  console.log('Express server started at port 3000');
});

譯者注:這里不是很理解為什么代碼中錯誤狀態碼是505。

現在的代碼是不是看上去更加清晰了?我相信你很容易就能理解它。

首先,當我們引入express模塊后,得到的是一個函數。調用這個函數后就可以開始啟動我們的服務器了。

接下來,我們用 server.set() 來設置監聽端口。而 process.env.PORT 是程序運行時的環境所設置的。如果沒有這個設置,我們默認它的值是3000.

然后,觀察上面的代碼,你會發現Express里的路由都遵循一個格式:

server.VERB('route',callback);

這里的VERB可以是GET、POST等動作,而pathname是跟在域名后的字符串。同時,callback是我們希望接收到一個請求后觸發的函數。

最后我們再調用 server.listen() ,還記得它的作用吧?

以上就是Node程序里的路由,下面我們來挖掘一下Node如何調用數據庫。

NodeJS里的數據庫

很多人喜歡用JavaScript來做所有事。剛好有一些數據庫滿足這個需求,比如MongoDB、CouchDB等待。這些數據庫都是NoSQL數據庫。

一個NoSQL數據庫以鍵值對的形式作為數據結構,它以文檔為基礎,數據都不以表格形式保存。

我們來可以看看MongoDB這個NoSQL數據庫。如果你使用過MySQL、SQLserver等關系型數據庫,你應該熟悉數據庫、表格、行和列等概念。 MongoDB與他們相比并沒有特別大的區別,不過還是來比較一下吧。

譯者注:這兒應該有個表格顯示MongoDB與MySQL的區別,但是原文里沒有顯示。

為了讓數據更加有組織性,在向MongoDB插入數據之前,我們可以使用Mongoose來檢查數據類型和為文檔添加驗證規則。它看上去就像Mongo與Node之間的中介人。

由于本文篇幅較長,為了保證每一節都盡可能的簡短,請你先閱讀官方的 MongoDB安裝教程

此外, Chris Sevilleja 寫了一篇 Easily Develop Node.js and MongoDB Apps with Mongoose ,我認為這是一篇適合入門的基礎教程。

使用Node和Express編寫RESTful API

API是應用程序向別的程序發送數據的通道。你有沒有登陸過某些需要你使用非死book賬號登錄的網頁?非死book將某些函數公開給這些網站使用,這些就是API。

一個RESTful API應該不以服務器/客戶端的狀態改變而改變。通過使用一個REST接口,不同的客戶端,即使它們的狀態各不相同,但是在訪問相同的REST終端時,應該做出同一種動作,并且接收到相同的數據。

API終端是API里返回數據的一個函數。

編寫一個RESTful API涉及到使用JSON或是XML格式傳輸數據。讓我們在NodeJS里試試吧。我們接下來會寫一個API,它會在客戶端通過AJAX發起請求后返回一個假的JSON數據。這不是一個理想的API,但是能幫助我們理解在Node環境中它是怎么工作的。

  1. 創建一個叫node-api的文件夾;
  2. 通過命令行進入這個文件夾,輸入 npm init 。這會創建一個收集依賴的文件;
  3. 輸入 npm install --save express 來安裝express;
  4. 在根目錄新建3個文件: server.js , index.html 和 users.js ;
  5. 復制下面的代碼到相應的文件:
//users.js
module.exports.users = [
 {
  name: 'Mark',
  age : 19,
  occupation: 'Lawyer',
  married : true,
  children : ['John','Edson','ruby']
 },

 {
  name: 'Richard',
  age : 27,
  occupation: 'Pilot',
  married : false,
  children : ['Abel']
 },

 {
  name: 'Levine',
  age : 34,
  occupation: 'Singer',
  married : false,
  children : ['John','Promise']
 },

 {
  name: 'Endurance',
  age : 45,
  occupation: 'Business man',
  married : true,
  children : ['Mary']
 },
]

這是我們傳給別的應用的數據,我們導出這份數據讓所有程序都可以使用。也就是說,我們將users這個數組保存在 modules.exports 對象中。

//server.js
const express = require('express'),
      server = express(),
      users = require('./users');

//setting the port.
server.set('port', process.env.PORT || 3000);

//Adding routes
server.get('/',(request,response)=>{
 response.sendFile(__dirname + '/index.html');
});

server.get('/users',(request,response)=>{
 response.json(users);
});

//Binding to localhost://3000
server.listen(3000,()=>{
 console.log('Express server started at port 3000');
});

我們執行 require('express') 語句然后使用 express() 創建了一個服務變量。如果你仔細看,你還會發現我們引入了別的東西,那就是 users.js 。還記得我們把數據放在哪了嗎?要想程序工作,它是必不可少的。

express有許多方法幫助我們給瀏覽器傳輸特定類型的內容。 response.sendFile() 會查找文件并且發送給服務器。我們使用 __dirname 來獲取服務器運行的根目錄路徑,然后我們把字符串 index.js 加在路徑后面保證我們能夠定位到正確的文件。

response.json() 向網頁發送JSON格式內容。我們把要分享的users數組傳給它當參數。剩下的代碼我想你在之前的文章中已經很熟悉了。

//index.html

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>Home page</title>
</head>
<body>
 <button>Get data</button>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

  <script type="text/javascript">

    const btn = document.querySelector('button');
    btn.addEventListener('click',getData);
    function getData(e){
        $.ajax({
        url : '/users',
        method : 'GET',
        success : function(data){
           console.log(data);
        },

        error: function(err){
          console.log('Failed');
        }
   });
  } 
 </script>
</body>
</html>

在文件夾根目錄中執行 node server.js ,現在打開你的瀏覽器訪問 localhost:3000 ,按下按鈕并且打開你的瀏覽器控制臺。

在 btn.addEventListent('click',getData); 這行代碼里,getData通過AJAX發出一個GET請求,它使用了 $.ajax({properties}) 函數來設置 url , success 和 error 等參數。

在實際生產環境中,你要做的不僅僅是讀取JSON文件。你可能還想對數據進行增刪改查等操作。express框架會將這些操作與特定的http動詞綁定,比如POST、GET、PUT和DELETE等關鍵字。

要想深入了解使用express如何編寫API,你可以去閱讀 Chris Sevilleja 寫的 Build a RESTful API with Express 4

使用socket進行網絡連接

計算機網絡是計算機之間分享接收數據的連接。要在NodeJS中進行連網操作,我們需要引入 net 模塊。

const net = require('net');

在TCP中必須有兩個終端,一個終端與指定端口綁定,而另一個則需要訪問這個指定端口。

如果你還有疑惑,可以看看這個例子:

以你的手機為例,一旦你買了一張sim卡,你就和sim的電話號碼綁定。當你的朋友想要打電話給你時,他們必須撥打這個號碼。這樣你就相當于一個TCP終端,而你的朋友是另一個終端。

現在你明白了吧?

為了更好地吸收這部分知識,我們來寫一個程序,它能夠監聽文件并且當文件被更改后會通知連接到它的客戶端。

  1. 創建一個文件夾,命名為 node-network ;
  2. 創建3個文件: filewatcher.js 、 subject.txt 和 client.js 。把下面的代碼復制進 filewatcher.js 。

    //filewatcher.js
    
    const net = require('net'),
       fs = require('fs'),
       filename = process.argv[2],
    
    server = net.createServer((connection)=>{
     console.log('Subscriber connected');
     connection.write(`watching ${filename} for changes`);
    
    let watcher = fs.watch(filename,(err,data)=>{
      connection.write(`${filename} has changed`);
     });
    
    connection.on('close',()=>{
      console.log('Subscriber disconnected');
      watcher.close();
     });
    
    });
    server.listen(3000,()=>console.log('listening for subscribers'));
  3. 接下來我們提供一個被監聽的文件,在 subject.txt 寫下下面一段話:

    Hello world, I'm gonna change
  4. 然后,新建一個客戶端。下面的代碼復制到 client.js 。

    const net = require('net');
    let client = net.connect({port:3000});
    client.on('data',(data)=>{
     console.log(data.toString());
    });
  5. 最后,我們還需要兩個終端。第一個終端里我們運行 filename.js ,后面跟著我們要監聽的文件名。

    //subject.txt會保存在filename變量中
    node filewatcher.js subject.txt
    //監聽訂閱者

在另一個終端,也就是客戶端,我們運行 client.js 。

node client.js

現在,修改 subject.txt ,然后看看客戶端的命令行,注意到多出了一條額外信息:

//subject.txt has changed.

網絡的一個主要的特征就是許多客戶端都可以同時接入這個網絡。打開另一個命令行窗口,輸入 node client.js 來啟動另一個客戶端,然后再修改 subject.txt 文件。看看輸出了什么?

我們做了什么?

如果你沒有理解,不要擔心,讓我們重新過一遍。

我們的 filewatcher.js 做了三件事:

  1. net.createServer() 創建一個服務器并向許多客戶端發送信息。
  2. 通知服務器有客戶端連接,并且告知客戶端有一個文件被監聽。
  3. 最后,使用wactherbianl監聽文件,并且當客戶端端口連接時關閉它。

    再來看一次 filewatcher.js 。

//filewatcher.js

const net = require('net'),
   fs = require('fs'),
   filename = process.argv[2],

server = net.createServer((connection)=>{
 console.log('Subscriber connected');
 connection.write(`watching ${filename} for changes`);

let watcher = fs.watch(filename,(err,data)=>{
  connection.write(`${filename} has changed`);
 });

connection.on('close',()=>{
  console.log('Subscriber disconnected');
  watcher.close();
 });

});
server.listen(3000,()=>console.log('listening for subscribers'));

我們引入兩個模塊:fs和net來讀寫文件和執行網絡連接。你有注意到 process.argv[2] 嗎?process是一個全局變量,提供NodeJS代碼運行的重要信息。 argv[] 是一個參數數組,當我們獲取 argv[2] 時,希望得到運行代碼的第三個參數。還記得在命令行中,我們曾輸入文件名作為第三個參數嗎?

node filewatcher.js subject.txt

此外,我們還看到一些非常熟悉的代碼,比如 net.createServer() ,這個函數會接收一個回調函數,它在客戶端連接到端口時觸發。這個回調函數只接收一個用來與客戶端交互的對象參數。

connection.write() 方法向任何連接到3000端口的客戶端發送數據。這樣,我們的 connetion 對象開始工作,通知客戶端有一個文件正在被監聽。

wactcher包含一個方法,它會在文件被修改后發送信息給客戶端。而且在客戶端斷開連接后,觸發了close事件,然后事件處理函數會向服務器發送信息讓它關閉watcher停止監聽。

//client.js
const net = require('net'),
      client = net.connect({port:3000});
client.on('data',(data)=>{
  console.log(data.toString());
});

client.js 很簡單,我們引入net模塊并且調用connect方法去訪問3000端口,然后監聽每一個data事件并打印出數據。

當我們的 filewatcher.js 每執行一次 connection.write() ,我們的客戶端就會觸發一次data事件。

以上只是網絡如何工作的一點皮毛。主要就是一個端點廣播信息時會觸發所有連接到這個端點的客戶端上的data事件。

如果你想要了解更多Node的網絡知識,可以看看官方NodeJS的文檔: net模塊 。你也許還需要閱讀 Building a Tcp service using Node

作者總結

好了,這就是我要講的全部。如果你想要使用NodeJS來編寫web應用程序,你要知道的不僅僅是編寫一個服務器和使用express進行路由。

下面是我推薦的一些書:

NodeJs the right way Web Development With Node and Express

如果你還有什么見解,可以在下面發表評論。

譯者注:這個翻譯項目才開始,以后會翻譯越來越多的作品。我會努力堅持的。

項目地址: https://github.com/WhiteYin/translation

 

來自:https://segmentfault.com/a/1190000013241874

 

 本文由用戶 untn9315 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!