Node express ejs 個人微博（一）

記：專案搭建 router使用 前端請求處理

1.全域性安裝2個模組

express、express-generator

在命令列輸入: 

cnpminstall  express --save

cnpminstall -g express-generator

檢視是否全域性安裝express成功命令: express -V

看到版本號就算是安裝成功了.

2.生成專案基本框架

命令: express xxx,   4.x版本的express預設頁面模板引擎是jade,

如果想用ejs,

3.下載專案所需的模組

自動建立了資料夾,然後再執行命令 :   npm install

npminstall是下載專案所需的基本模組,這個定義在package.json檔案的dependencies中

4.執行專案

命令:npm start

瀏覽器訪問 : http://localhost:3000/

5.看看專案結構

bin下的www是專案入口
node_moduls 專案所需模組
public 靜態資源,如圖片,js,css
routes 路由檔案
views 頁面檔案
app.js 專案需要的中介軟體等基本配置
package.json 定義專案的基本資訊等,包括專案所需要的模組名和版本號

6.自動更新服務

指令

Npm install nodemon –g

Cd bin/

Nodemon www
服務啟動成功

7.搭建路由頁面

1.首先認識router模組是如何引入專案

2.建立路由頁面

1.首先配置路由如下圖

程式碼講解：

router.get('/contentWB', function(req, res, next) {
  res.render('contentWB',{title:'文章列表',message:'fendo8888'}); 
});

// router 監聽訪問頁面兩種方式 get post 對應著前端傳送請求的兩種方式get post

// Get post後端處理方式講解

// 前端傳送請求
functionlogin() {
  var name = $('#name').val(); 
  var password = $('#password').val(); 
  if (!name || !password) { 

     alert('使用者名稱和密碼都不能為空'); 

     return; 

 } 

  $.ajax({
   type: 'get', // type: 'post',
   url: '/login', 
   data: {
       name: name, 
       password: password 
   },
   dataType: 'json',
   success: function (data) {
     if (data) { 
     } 
   },
    error: function () {
       alert('登入失敗!'); 
       return; 
    }
  })
}

 

// 後端請求處理get

router.get('/login', function (req, res, next) {
  // 獲取前臺傳遞引數 req.query
  var name = req.query.name;
  var pass = req.query.password;
  if (name == 'ss' && pass == '123') {
    res.send('登入成功');
  }
  res.end('end');
});
// 後端請求處理post
router.get('/login', function (req, res, next) {
  // 獲取前臺傳遞引數 req.body
  var name = req.body.name;
  var pass = req.body.password;
  if (name == 'ss' && pass == '123') {
     res.send('1');
  }
  res.end('end');

2.app.render(view,[options], callback)講解

這個方法目的是講渲染資料到指定‘view’使用引擎做出頁面，options 傳入頁面的資料。回撥函式 callback 用來處理返回的渲染後的字串（目前不知道有啥用）