node—express

express

• 安裝
• 配置
• 接收請求
• 響應

簡單的服務器 08express1/server.js

    const express = require('express');

    var server = express();//建立服務
    //請求根目錄執行

    server.use('/a.html',function(req,res){
        res.send('aaa');
        res.end();
    });
    server.use('/b.html',function(req,res){
        res.send('bbb');
        res.end();
    });

    server.listen(8080);//監聽

req res 原來的方法還有。只是新增了一些東西，好比write，end

    //send能夠直接返回 json
    server.use('/a.html',function(req,res){
        res.send({a:1,b:2});
        res.end();
    });

小結

• 建立服務 var server = express();
• 處理請求 server.use(地址,function(req,res){})
• 監聽 server.listen(8080);

---

3種接收用戶請求的方法 08express1/server1.js

職匹配一個

• get請求： get('/',function(req,res){})
• post請求： post('/',function(req,res){})
• request： use('/',function(req,res){})

響應文件 08express1/server2.js

• express-static：

  npm install express-static
  

• 08express1/server2.js

  const express = require('express');
  const expressStatic = require('express-static');
  var server = express();
  
  server.listen(8080);
  
  //指定去哪兒讀 靜態文件
  server.use(expressStatic('./www'));
  
  // localhost:8080/a.html
  

接口 08express1/server3.js

• /login?username=yuonly&pwd=123

• 返回： {"ok":true,"msg":"成功"}

• 獲取參數 req.query

          var users ={
              'yuonly':'123123',
              'zhangsan':'666',
              'lisi':'999'
          }
          server.get('/login',function(req,res){
              //直接獲取get參數的對象
              var username = req.query['username'];
              var pwd = req.query['pwd'];
              if(users[username]==null){
                  res.send({ok:false,msg:'用戶不存在'});
              }else{
                  if(users[username]!=pwd){
                      res.send({ok:false,msg:'用戶名密碼錯誤'});
                  }else{
                      res.send({ok:true,msg:'登陸成功'});
                  }
              }
          })
  
          // http://localhost:8080/login?username=lisi&pwd=123
  

數據處理 09express2/server.js 09express2/form.html

1 get: req.query

2 post: req.body

    安裝 bodyparser
    npm install body-parser

    引入模塊
    const bodyParser = require('body-parser');
    定義urlencoded中間件
    server.use(bodyParser.urlencoded({}));
    server.post('/',function(req,res){
        從req.body中讀取post數據
        console.log(req.body);
    })

小結

• get： 無需中間件 req.query

• post: 須要 body-parser中間件

      server.use(bodyParser.urlencoded({
          extended:true,//啓用擴展模式，意義不大
          limit:2*1024//限制 默認100k
      }));
  
      req.body
  

---

中間件：使用、寫、鏈式操做

鏈式操做 09express2/server1.js

    server.use('/',function(req,res,next){
        console.log('aaa');
        next();
    })

    server.use('/',function(req,res,next){
        console.log('bbb');
    })

本身定義一個body-parser中間件的功能 09express2/server2.js

        server.use(function(req,res,next){
            var str = '';
            req.on('data',function(data){
                str += data;
            })
            req.on('end',function(){
                //解析事後的數據，綁定到req.body身上
                req.body = querystring.parse(str);
                //next後，在下面匹配的中間件仍然能夠接收到 req.body的數據
                next();
            })
        })

        server.use('/',function(req,res){
            console.log(req.body);
        })

封裝本身的body-parser

1 09express2/lib/my-body-parser.js

        const querystring = require('querystring');

        module.exports = function(req,res,next){
            var str = '';
            req.on('data',function(data){
                str += data;
            })
            req.on('end',function(){
                req.body = querystring.parse(str);
                next();
            })
        }

2 在 09express2/server3.js 中使用

        const express = require('express');
        const bodyParser2 = require('./libs/my-body-parser.js');
        var server = express();
        server.listen(8080);
        server.use(bodyParser2);
        server.use('/',function(req,res){
            console.log(req.body);
        })

3 使用 09express2/form.html 測試

---

session、cookie

• cookie: 在瀏覽器保存一些數據,每次向服務器發起請求都會帶過來

  不安全、存儲空間小（4K）

• session: 保存在服務端，但session依賴cookie

  更安全

  cookie中會有一個sessionid的ID，服務器根據cookie帶過來的sessionid找到服務器端與之對應的文件，進行讀取或寫入
  

cookie 10cookie-session/server.js

        cnpm install express express-static cookie-parser cookie-session

• 讀取-cookie-parser
• 發送 res.cookie('user','yuonly',{path:'/aaa',maxAge:30*24*3600*1000});

• 加密 10cookie-session/server2.js

      req.secret = 'yuonly123123123';
      res.cookie('user','yuonly',{signed:true});
  

讀取及發送小例子 10cookie-session/server2.js

        const express = require('express');
        var server = express();
        //cookie
        const cookieparser = require('cookie-parser');
        server.use(cookieparser());

        server.use('/aaa/a.html',function(req,res){
            //讀取cookie 裝完cookie-parser後有這個屬性
            console.log(req.cookies,'read');
            //發送cookie
            res.cookie('user','yuonly',{path:'/aaa',maxAge:30*24*3600*1000});
            res.send('ok');
        })

        // http://localhost:8080/aaa/a.html

        server.listen(8080);

小結

• 發送

  res.sercet = 'sjksdjfkl123';
  res.cookie(名字，值，{path:生效路徑,maxAge:有效期,signed:是否須要簽名})
  

• 讀取cookie

  cookie-parser
  service.use(cookieParser(簽名))
  service.use(function(req,res){
  
      req.cookies;
      req.signedCookies;
  })
  

• 刪除

  res.clearCookie(key)
  

• 擴展--加密 cookie-encrypter

session 10cookie-session/server3.js

• cookie-session

1 讀取

        server.use(cookiesession({
            //session要有效，必須設置keys。
            keys:['111','2222','3333','4444','555']
        }));

        if(req.session['count']==null){
            req.session['count'] = 1;
        }else{
            req.session['count']++;
        }
        console.log(req.session['count']);
        res.send('ok');

        res.end();

2 寫入

    req.session['count'] = 1;

模板引擎

• jade-破壞式、侵入式、強依賴
• ejs-非侵入式的，不破壞原有的html、css

ejs

• 安裝

  cnpm install ejs
  

1 11ejs/1.js

    const ejs = require('ejs');
    //              模板            數據             
    ejs.renderFile('./view/1.ejs',{name:'yuonly'},function(err,data){
        console.log(data);
    });

2 11ejs/view/1.ejs

    <div>
      <%= name %>
    </div>

ejs 循環數據

1 11ejs/2.js

    const ejs = require('ejs');

    ejs.renderFile('./view/2.ejs',{json:{arr:[{username:'yuonly'},{username:'xiaowang'}]}},function(err,data){
        console.log(data);
    });

2 11ejs/view/2.ejs

    <% for(var i=0;i<json.arr.length;i++){ %>
      <div>
        <%= json.arr[i].username %>
      </div>
      <% } %>

ejs中非轉義輸出 <%- %>

1 11ejs/view/3.ejs

    <% var str = '<div></div>'; %>
    // html實體
      <%= str %>
      // html標籤自己
        <%- str %>

express整合到一塊兒 012expressall

• 主體
• cookie、session
• 數據
• 模板引擎

1 安裝相關包

    cnpm install express express-static cookie-parser cookie-session body-parser ejs --save

2 目錄說明

• libs：第三方模塊
• views：模板
• www：網站根目錄
• server.js: express服務器

bodyparser弊端，只能解析post數據，不能處理post上來的文件

文件上傳測試 12expressall/server_file.js post.html

1 body-parser

只能獲取上傳文件的文件名.form表單 加上 enctype以後，乾脆沒東西了。

server_file.js

        const express = require('express');
        const bodyParser = require('body-parser');
        var server = express();
        server.use(bodyParser.urlencoded({extended:false}));
        server.post('/',function(req,res){
            console.log(req.body);
        })
        server.listen(8080);

post.html

        <form action="http://localhost:8080" method="post" enctype="multipart/form-data">
          文件: <input type="file" name="username" id=""> <br>
          <input type="submit" value="上傳">
        </form>

2 multer 用來處理文件上傳 12expressall/server_multer.js

        //1 安裝
        cnpm install multer --save
        //2 導入
        var multer = require('multer');
        //3 建立multer對象
        var objMulter = multer({dest:'./www/upload/'});
        //4 使用對應方法，any 上傳多文件
        server.use(objMulter.single('f1'));

        server.post('/',function(req,res){
            //5 獲取上傳文件
            console.log(req.files);
            // [ { fieldname: 'username',
            // originalname: '屏幕快照 2017-05-30 上午8.12.11.png',
            // encoding: '7bit',
            // mimetype: 'image/png',
            // buffer: <Buffer 89 50 4e 47 0d 0a 1a 0a 00 00 00 0d 49 48 44 52 00 00 01 10 00 00 01 94 08 06 00 00 00 fd 2b 7d db 00 00 01 5e 69 43 43 50 49 43 43 20 50 72 6f 66 69 ... >,
            // size: 160018 } ]
        })

3 發現上傳後的文件沒有擴展名，因此須要用fs模塊對該文件進行重命名 12expressall/rename.js a.txt

4 若是要對上傳文件重命名，還須要知道原來文件的路徑等信息，使用path。12expresssall/path.js

---

文件上傳小結

• body-parser ：用來解析post數據

• multer：用來解析文件的數據 enctype="multipart/form-data"

      //1 multerObj
      var obj = multer({dest:'upload'});
      //2 設定上傳方法
      server.use(obj.any());
      //3 使用
      server.use('/',function(req,res,next){
          <!-- req.files -->
          //4.新的文件名
          var pathObj = pathLib.parse(req.files[0].originalname);
          var newName = req.files[0].path + pathObj.ext;
          //5.重命名 req.files[0].path
          fs.rename(req.files[0].path,newName,function(err){
              if(err){
                  res.send('上傳失敗');
              }else{
                  res.send('成功');
              }
          })
      })
  

---

consolidate-適配各類模板引擎

        cnpm install consolidate --save

配置模板引擎

• 輸出什麼東西

  server.set('view engine','html');
  

• 模板文件放在哪兒了

  server.set('views','./views');
  

• 我要用哪一種模板引擎

  server.engine('html',consolidate.ejs);
  

路由 13express_consolidate/server_route.js

至關於子服務器 server

    //1.建立router
    var routeUser = express.Router();
    //2.把router添加到server
    server.use('/user',routeUser);
    //3.router內部的路由的定義
    routeUser.get('/1.html',function(req,res){
        res.send('user1');
    })
    routeUser.get('/2.html',function(req,res){
        res.send('user222');
    })



    //localhost:8080/user/1.html
    //localhost:8080/user/2.html

mysql 14mysql

• 關係型： mysql、oracle
• 非關係型-文件型： mongo

Server端：存數據 Client端：管理工具、Node

---

Server安裝 官網下載安裝

基本概念

1 庫：文件夾

2 表：excel文件

行： 一條數據

列：（字段、域） 一個數據項

客戶端安裝

    cnpm i mysql --save

使用nodejs 連接mysql

        const mysql = require('mysql');
        //1.連接數據庫
        // mysql.createConnection(哪臺服務器,用戶名，密碼,庫名);
        var db = mysql.createConnection({
            host:'localhost',
            user:'root',
            password:'root',
            database:'jy1608_blog',
            port:8889
        });
        //2.查詢
        db.query("SELECT * FROM `user`;",function(err,data){
            if(err){
                console.log(err);
            }else{
                console.log(data,'data');
            }
        })