本文地址：http://blog.csdn.net/z040145/article/details/50425562
0：開篇廢話
好久沒來記錄點東西了，以前記錄的都是一些解決小問題的代碼片段，只能算是當記事本來用的吧。
換了工作，好像沒那麼多代碼要寫了，那就自己找點事做，於是重新翻出了nodejs，以前是在主程的搭建環境下，寫一些接口給我的iOS前端，當時就覺得nodejs功能強大，簡潔明瞭，實在是輕量服務器首選，沒錯，給app做服務器實在太合適，一個iOS／android攻城獅輕鬆搭起自己的服務器。
今天主要任務是完成前端post請求，服務器得到前端傳值，處理後返回json給前端，前端輸出在頁面上。我是做app的，今天例子以web前端爲例，一步一步手把手教你搭建好自己的服務器。
今天的內容記錄一下nodejs的環境，安裝，以及最簡單的代碼實例。已經進入工程目錄的同學，直接進入第六部分就可以了，翠花，上乾貨。
一：nodejs簡介
網絡上介紹很多，百度一下就好，這裏取一點重要的內容，面試必備：
Node.js 是一個基於 Chrome V8 引擎的 JavaScript 運行環境。Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型，使其輕量又高效。
Node.js是單線程的，它通過事件輪詢（event loop）來實現多任務並行操作，對此，我們應該要充分利用這一點 —— 儘可能的避免阻塞操作，取而代之，多使用非阻塞操作。
二：node開發環境
- Mac電腦：系統版本10.11.1
- node版本：node-v5.2.0
- node工程源代碼：官網下載node-v5.2.0.tar.gz http://nodejs.cn/download/
- 開發工具：webstorm 10.0.4
- 瀏覽器：Chrome 42.0.2311.152 (64-bit)
- jquery版本：jQuery 1.11.3（官網下載，未壓縮開發版）
- javaforosx，可能需要。
三：nodejs安裝
進入官網下載，這個不收費，所以不要在亂七八糟的網站下什麼綠色版了
俗話說，買新不買舊。哈哈，不要保守了，你們懂的，果斷下最新版。
應該沒什麼區別，我這裏就不下載了，還是用5.2.0吧，聽着好聽520嘛，明白就好。下載好一路同意確定就可以。
OK，安裝好了！（什麼，這就搞定了？這麼簡單？這麼簡單還寫什麼教程啊！）啊哈哈！
四：webstorm的安裝
百度搜索webstorm Mac下載，如果下載的是沒有破解碼生成工具的，需要自己解決啦。
提供個下載地址，我的網盤： http://pan.baidu.com/s/1o6U5wXs
右邊是webstorm，左邊是key製作工具。
五：nodejs工程的創建
打開WebStorm－》Create New Project－》
Location：自己選擇工程要創建的目錄，最後的untitled1就是你的工程名字了。
Node interpreter 和 Npm executable是node的環境，不需要更改。
點擊Create進入讀圖頁面
選擇nodejs源代碼地址，就是二－》3裏面下載的源代碼了，如果有基礎工程模版，那就省事了～～最好不要點第一項“從網絡下載“很慢很坑爹
Configure！GO！
OK！項目創建完畢！
到這裏，我們的服務器就可以運行啦，點擊上方的開始運行，一個監聽3000端口的服務器就開啓了，打開瀏覽器，輸入http://localhost:3000 。服務器的輸出就看到啦，輸入http://localhost:3000/users 得到另一個接口的輸出。
知其然不知其所以然？接着往下看。
六：工程介紹
- bin－》www：server的創建，名字，監聽端口號，錯誤處理
- node_modules：存放各種基礎模塊文件，比如我們的express，類似與iOS中的各種庫。
- public：靜態文件目錄。放置託管的靜態文件，例如圖片、CSS、JavaScript 文件等，通過http://localhost:3000/images/kitten.jpg 方式就可以直接訪問。
- routes：MVC中的Controller目錄
index.js－》exports方法：可以將接口暴露給外部調用
index.js－》res.render方法：將數據通過引擎模版（這裏是jade）做展示，用不到
users.js－》res.send方法：將數據直接返回給請求方。由於我們是要做app的服務器，只要返回json就可以了，所以選擇此方法。 - views：MVC中的View目錄，存放視圖模版（這裏是jade），整個用不到。
- app.js：工程主進程文件。
app.js詳細說明，有些不對的，還望指正！3Q！
- 1到6行：引入各種模塊，相當於iOS中引入各種庫文件。
- express：核心，不詳細說明，官網查介紹和API：http://www.expressjs.com.cn/
- path：處理和轉換文件路徑的工具集
- favicon：圖標
- logger：日誌模塊
- 8，9行： 引入Controller文件
- 11行：創建express應用
- 13到23行：服務器基本設置，如設置favicon圖片，dev環境，靜態文件目錄
- 25，26行：分配請求接口到Controller中的具體方法
- 28到33行：處理404
- 35到57行：錯誤處理，分爲dev和pro兩種設置
七：代碼實例
github項目地址： https://github.com/xx040145/NodeJSBaseProject.git
分兩個部分來說吧：
- 目錄結構改造：
由於MVC思想的深入，所以打算把這裏也改造成MVC的目錄結構
- bin：老樣子server設置
- controller：控制器，C層
- model：M層，完成和數據庫的交互。暫時用不到。
- node_modules:老樣子模塊目錄
- public：靜態目錄。如果是做web前端的同學，可以把這裏做V層，完全當做web前端開發就可以了。如果是做app的同學，這裏就當作資源目錄，存放app訪問和上傳用的圖片，視頻，音頻，因爲V層是我們的app。 -
- 代碼解析：
app.js中這裏充當路由分配，引入C模塊調用接口：
//引入控制器文件
var routes = require('./controller/index');
var users = require('./controller/users');
//路由接口
app.use('/', routes);
app.use('/users', users);html代碼，記得引用jquery
前端JS代碼，post請求，傳值。回調中將結果顯示在頁面上
服務器index.js代碼，接收req，將數字相加，發送json給前端
瀏覽器訪問效果圖如下
控制檯：
總結：
javascript簡單好學，而又功能強大。nodejs作爲一個輕量級服務器，搭建輕鬆，可以滿足輕量級app的所有需求，實在是前端攻城獅喜聞樂見的東西。後面準備再把mysql搭建起來，從前端到服務器，再到數據庫，作爲一個前端工程師，全都熟悉一遍，對整個眼界的提升是不一樣的。深入學習之後，進可以去創業型公司做技術主管，退可以自己搗鼓創意而不受技術上的制約。簡直棒棒噠！
錯誤彙總：
1：由於各種軟件都不是在appStore上下載，所以安裝時候可能會遇到警告
比如使用WebStorem的key製作工具時遇到這個情況：
解決方法：打開系統偏好設置－》安全性與隱私－》“仍要打開“。再不行，就先開了鎖
2：使用WebStorm創建新工程時，會要你提供模版，千萬不要使用第一個，自動從網絡下載，等幾分鐘就錯誤，各種錯誤。最好去nodejs中文網直接下載給它。
3：indexJS.js中， 一定要寫成http://localhost:3000/，不然Chrome會報錯，說不支持跨域post請求。其實這也是個好習慣，別嫌麻煩。
4：favicon.ico圖片要放在public下，記得打開app.js的17行把名字和相對地址寫對