在項目開發的過程當中，總會有前端開發快完成，后端接口卻遲遲提供不了的情況。此時為了不影響前端開發的進度，我們可以借助puer來模擬后端接口測試。簡單的說，puer就是一個可以實時刷新的前端服務器。具體關於puer的介紹可以參考這篇文章：http://leeluolee.github.io/2014/10/24/use-puer-helpus-developer-frontend/
1.先安裝nodeJS
2.安裝puer
npm install puer -g
3.puer命令介紹
Usage: puer [options...]
Options:
-p,--port server's listen port, 8000 default，可使用這個命令修改端口，比較常用
-f,--filetype fileType to watch(split with '|'), default 'js|css|html|xhtml'
-d,--dir your customer working dir. default current dir
-i,--inspect start weinre server and debug all puer page
-x,--exclude exclude file under watching(must be a regexp), default: ''
-a,--addon your addon's path，綁定域名，比較常用
-t,--target proxy url，代理URL，比較常用，默認是localhost
--no-reload close auto-reload feature,(not recommended)
--no-launch close the auto launch feature
-h,--help help list
4. 使用方法
4.1命令行中輸入以下命令。（第一種方法），可使用這種方法快速編寫靜態頁面，不需要手動刷新。
cd /path/to/workspace ↵
puer
puer會默認打開http://localhost:8000/（端口可以用 -p 8001參數進行控制）,頁面會列出該目錄下所有的文件
4.2命令行中輸入以下命令（第二種方法），這種方法可以實時更新接口數據。
cd /path/to/workspace ↵
puer -a route.js
puer提供了叫插件(addon)的功能，集成了express的route.js(route.js的名字可以隨意取)來達到最簡的路由配置，可以提供基於真實http請求與相應的動態的mock數據。route.js文件代碼如下：
// use addon to mock http request module.exports = { // GET "GET /v1/posts/:id": function(req, res, next){ // response json format res.send({ title: "title changed", content: "tow post hahahah", desc:'aaaa', age:'111', name:'bbbb' }) }, // PUT POST DELETE is the same "PUT /v1/posts/:id": function(){ }, "POST /v1/posts": function(){ }, "DELETE /v1/posts/:id": function(){ } }
它其實就是一段nodejs程序，輸出是一配置對象，key的空格前代表的是請求Method，后半部分是請求路徑，而value代表回調函數和express的路由中間件是一致的，傳入的是request和response對象。返回配置中的URL就可以返回定義的值，如下圖：
4.3.使用代理模式，應用puer到以有服務器中，這種方法最實用，工作中也是用到最多的。
一般在開發過程中，完全使用靜態文件開發比較少，一般都是會啟動本地的運行環境。這個時候，我們可以使用--target path（-t命令）切換到代理模式將puer作為一個代理服務器使用。比如本地已經存在一個localhost:7070的服務，你要在其上實現自動刷新的功能，請使用-t 或 --target。這樣puer的服務器地址就會指向你本地服務(localhost:7070)的地址，可以配合addon模式使用，這樣就可以直接使用定義的接口了。操作步驟如下圖：
DOM命令中輸入：
puer -t http://localhost:7070 -a a.js
-t http://localhost:7070 使用代理，代理指向localhost:7070,locahost:7070指工程本地啟動的服務
-a a.js 頁面所需的所有接口都寫在a.js里面，配置路由，這樣就可以提供基於真實http請求與相應的動態的mock數據
如果是在工程代碼所在的目錄下執行puer（比如上面的例子：D:\git\myProject），最大的好處是：
1.無論是寫樣式還是html代碼，頁面實時刷新。
2.模擬真實的http請求，自定義接口返回的數據。
如果是其他的目錄，也可以模擬真實的http請求，只是不能隨時監聽工程目錄下的文件變化。
使用代理服務后，頁面的訪問地址可以和接口文件里的請求地址處於一個域下的，所以發請求不會有跨域問題。
另外一種比較簡單的調試方法就是，使用上述4.2的方法啟動puer，JS里的請求數據寫好，然后參考chrome設置--disable-web-security解決跨域這篇文章來啟動chrome，即使在不同域下，也可以直接使用接口數據進行調試了。