鍍金池/ 教程/ HTML/ 一個最簡單的 express 應用
瀏覽器端測試:mocha,chai,phantomjs
搭建 Node.js 開發(fā)環(huán)境
測試用例:mocha,should,istanbul
線上部署:heroku
Mongodb 與 Mongoose 的使用
使用 superagent 與 cheerio 完成簡單爬蟲
js 中的那些最佳實踐
使用 eventproxy 控制并發(fā)
使用 promise 替代回調函數(shù)
作用域與閉包:this,var,(function () {})
持續(xù)集成平臺:travis
測試用例:supertest
benchmark 怎么寫
使用 async 控制并發(fā)
學習使用外部模塊
一個最簡單的 express 應用
正則表達式
cookie 和 session

一個最簡單的 express 應用

目標

建立一個 lesson1 項目,在其中編寫代碼。當在瀏覽器中訪問 http://localhost:3000/ 時,輸出 Hello World。

挑戰(zhàn)

訪問 http://localhost:3000/ 時,輸出 你好,世界。

知識點

  1. 學習使用 npm 安裝依賴
  2. 學習新建 express 實例,并定義 routes ,產生輸出。

課程內容

按照慣例,我們來個 helloworld 入門。

express 是 Node.js 應用最廣泛的 web 框架,現(xiàn)在是 4.x 版本,它非常薄。跟 Rails 比起來,完全兩個極端。

express 的官網是 http://expressjs.com/ ,我常常上去看它的 API。

首先我們需要得到一個 express。

從 php 和 python 來的同學可能對于“包依賴管理”的概念不是太熟悉,ruby 來的同學應該就熟悉多了。

在 python 中,包管理使用 easy_install 或者 pip,ruby 中我們使用 gem。而在 Node.js 中,對應就是 npm,npm 是 Node.js Package Manager 的意思。

不同于 ruby 的 gem 裝在全局,Node.js 的依賴是以項目為單位管理的,直接就安裝在項目的 node_modules 目錄下,而且每個依賴都可以有指定版本的其他依賴,這些依賴像一棵樹一樣。根據我自己的使用經驗來說,npm 的體驗在 pip 和 gem 之上。

OK,新建一個文件夾叫 lesson1 的,進去里面安裝 express

$ mkdir lesson1 && cd lesson1
# 這里沒有從官方 npm 安裝,而是使用了大淘寶的 npm 鏡像
$ npm install express --registry=https://registry.npm.taobao.org

安裝完成后,我們的 lesson1 目錄下應該會出現(xiàn)一個 node_modules 文件夾,ls 看看

$ ls node_modules

里面如果出現(xiàn) express 文件夾則說明安裝成功。

或者 npm命令提供更清晰直觀的顯示:

$ npm list

我們繼續(xù)應用程序的編寫。

新建一個 app.js 文件

$ touch app.js

copy 進去這些代碼

// 這句的意思就是引入 `express` 模塊,并將它賦予 `express` 這個變量等待使用。
var express = require('express');
// 調用 express 實例,它是一個函數(shù),不帶參數(shù)調用時,會返回一個 express 實例,將這個變量賦予 app 變量。
var app = express();

// app 本身有很多方法,其中包括最常用的 get、post、put/patch、delete,在這里我們調用其中的 get 方法,為我們的 `/` 路徑指定一個 handler 函數(shù)。
// 這個 handler 函數(shù)會接收 req 和 res 兩個對象,他們分別是請求的 request 和 response。
// request 中包含了瀏覽器傳來的各種信息,比如 query 啊,body 啊,headers 啊之類的,都可以通過 req 對象訪問到。
// res 對象,我們一般不從里面取信息,而是通過它來定制我們向瀏覽器輸出的信息,比如 header 信息,比如想要向瀏覽器輸出的內容。這里我們調用了它的 #send 方法,向瀏覽器輸出一個字符串。
app.get('/', function (req, res) {
  res.send('Hello World');
});

// 定義好我們 app 的行為之后,讓它監(jiān)聽本地的 3000 端口。這里的第二個函數(shù)是個回調函數(shù),會在 listen 動作成功后執(zhí)行,我們這里執(zhí)行了一個命令行輸出操作,告訴我們監(jiān)聽動作已完成。
app.listen(3000, function () {
  console.log('app is listening at port 3000');
});

執(zhí)行

$ node app.js

這時候我們的 app 就跑起來了,終端中會輸出 app is listening at port 3000。這時我們打開瀏覽器,訪問 http://localhost:3000/,會出現(xiàn) Hello World。如果沒有出現(xiàn)的話,肯定是上述哪一步弄錯了,自己調試一下。

補充知識

在這個例子中,node代碼監(jiān)聽了3000端口,用戶通過訪問http://localhost:3000/ 得到了內容,為什么呢?

端口

端口的作用:通過端口來區(qū)分出同一電腦內不同應用或者進程,從而實現(xiàn)一條物理網線(通過分組交換技術-比如internet)同時鏈接多個程序 Port_(computer_networking)

端口號是一個 16位的 uint, 所以其范圍為 1 to 65535 (對TCP來說, port 0 被保留,不能被使用. 對于UDP來說, source端的端口號是可選的, 為0時表示無端口).

app.listen(3000),進程就被打標,電腦接收到的3000端口的網絡消息就會被發(fā)送給我們啟動的這個進程

URL

RFC1738 定義的url格式籠統(tǒng)版本<scheme>:<scheme-specific-part>, scheme有我們很熟悉的http、https、ftp,以及著名的ed2k,thunder。

通常我們熟悉的url定義成這個樣子

<scheme>://<user>:<password>@<host>:<port>/<url-path>

用過ftp的估計能體會這么長的,網頁上很少帶auth信息,所以就精簡成這樣:

<scheme>://<host>:<port>/<url-path>

在上面的例子中, scheme=http, host=localhost, port=3000, url-path=/, 再聯(lián)想對照一下瀏覽器端window.location對象。 著名的localhost,你可以在電腦的hosts文件上找到

在這篇文章中提到URI schemes are frequently and incorrectly referred to as "protocols", or specifically as URI protocols or URL protocols, since most were originally designed to be used with a particular protocol, and often have the same name,比較認同這個觀點,尤其是今天移動設備的時代里, android和ios的開發(fā)中大量使用uri作為跨app通訊通道,把scheme理解為協(xié)議略狹隘了。

尾聲

在了解完端口和url之后,再去看例子代碼,相信應該好理解很多。 有必要的話,還可以在解刨一下express的use邏輯,對峙http.createServer,相信還有火花,:)