Day 50 (Node.js)

1.保留表单资料

登入资料输入错误，无法登入保留输入值

(1)login.html

    <input type="password" name="txtPassword" id="txtPassword" value="<%= password %>" />

(2)routes > users.js

     //抓到 login.html password="内容" 给 post     router.get('/login', function(req, res, next) {       res.render('login',{ password: "" });     });

     //抓到 接收get 显示 login.html password="txtPassword"     router.post('/login', function(req, res, next) {     if(!userName){      //如果userName是空的,继续login ; 逻辑:felse=0 相反 True         // 使用者指输入password，送出保留password         res.render('login',{ password : req.body.txtPassword });          return;  //跳出此判别式     }});

2.登入后，显示登出

(1)login.html

       <% if (userName == "Guest") { %>       <a href="/users/login" data-icon="star" data-theme="b" data-ajax="false">Login</a>       <% }else{ %>       <a href="/users/logout" data-icon="star" data-theme="b" data-ajax="false">logout</a>       <% } %>

(2)routes > users.js

       router.get('/logout', function(req, res, next) {           req.session.userName ="Guest"; //作法1. 此页面把userName改为Guest           delete req.session.userName;   //作法2. 此页面删除userName            res.redirect('/');             //转跳首页       });

delete 解释

    <script>      var obj = {        firstname: "HIHI",      };      alert(obj.firstname);  //HIHI      delete obj.firstname;      alert(obj.firstname);  //undefined    </script>

3.共同的网页内容

session要搭配动态伺服器，才能随时变更状态及抓资料等等..

4.连接资料库

(1)MySQL新增资料库资料

(2)建立mySQL物件
var mysql = require("mysql");

(3)连接mySQL物件 帐号,密码,连上哪,port号,资料库

    var conn = mysql.createConnection({          user:"root",                password:"root",        host:"localhost",  //"127.0.0.1",        port:3306,        database:"mask"    }) 

(4)检查连线有无成功(callback)

    conn.connect(function(err){        if (err) {            res.send(  JSON.stringify(err)   )        }    })

(5)送SQL语法

    var idVaule = req.query.id;     conn.query("select * from inventory where id = ?",        [ idVaule ],                                         function (err, result) {          res.send( JSON.stringify(result) );        }    );

5. req使用

req.query.id;

    res.send(req.query.id);     //http://localhost:3000/test?id=3

req.params

    app.get("/hello/:who", function(req,res){    res.send("hello!" + req.params.who);    })    //http://localhost:3000/hello/123.html

req.body

    var data = req.body.userName;    //抓html的body的userName

req.session

    app.get("/writeToSession",function(req,res){           req.session.userName="LILI";        // 写入网页内容    })    // http://localhost:3000/writeToSession

6. 资料库分页 档案Lab13、Node.js06影片

计算分页方式：

    1~10    11~20 page2    1    21~30 page3    2    (page - 1 前面有几页?)  * 10 + 1  + 10    ex:第三页 -1 = 2 * 10(跳过20笔) + 1(从21开始) + 10(到第30笔)    zero-base:    0~9      0               10~19    1    20~29    2    #2 * 10(跳过20笔) + 10(到第30笔)

    var nums_per_page = 10   //每页10笔    var offset = (page - 1) * nums_per_page       var sql =   `SELECT * FROM inventory LIMIT ${offset}, ${nums_per_page};                 SELECT COUNT(*) AS COUNT FROM inventory;`   //(COUNT)28 唯一一个纪录    connection.query(sql, function(error, data) { //data[0] data[1]        if (error) {            console.log(error);        }        //　data[1][0].COUNT : SELECT COUNT(*) AS COUNT FROM inventory;`   　　　　// 28(总比数)/10 ; ceil无条件进位        var last_page = Math.ceil(data[1][0].COUNT / nums_per_page)           if(page > last_page) {       //页数超过最后一页 到最后一页            res.redirect('/page/'+last_page)            return        }

7. 新增　资料库资料 - 档案Lab14、Node.js06影片

AJAX可以直接吃Json格式，但是网页的值不能直接转Json格式会跑掉
必须先用js转成阵列，然后再转Json格式才可以套用在AJAX

1.取值

      药局名称: <input type="text" name="name" /><br />      电话: <input type="text" name="phone" /><br />      地址: <input type="text" name="address" /><br />      成人口罩库存: <input type="text" name="adult_mask" /><br />      孩童口罩库存: <input type="text" name="child_mask" /><br />        //利用监听事件把资料传进资料库        $("#submit").on("click", function () {        //整理表单资料到变数        var data = $("#form").serializeArray(); // 1.把表单资料变成阵列 ; 只接收name        console.log(data);

2.把阵列变成JSON字串

        JSONData = serializeToJSON(data); // 2.把阵列变成JSON字串 

3.JSON字串function

        function serializeToJSON(data) {        var values = {};        for (index in data) {          // data[0].name;   // 0: {name: "name", value: "1"}          values[data[index].name] = data[index].value;          //   0: {name: "name", value: "1"}          //   1: {name: "phone", value: "2"}          //   2: {name: "address", value: "3"}          //   3: {name: "adult_mask", value: "4"}          //   4: {name: "child_mask", value: "5"}          }          return JSON.stringify(values);          }

4.ajax请求

        $.ajax({          url: "/add", //index.js收取          type: "POST", // 3.用POST方法，对/add丢，contentType格式资料          contentType: "application/json; charset=utf-8",          data: JSONData,          success: function (res) {            var res = JSON.parse(res);            //后端会封装一个response class，预先写好执行No.            if (res.errno === 1) {              alert("新增成功!");          // 4.如果丢成功            } else if (res.errno === 0) {              alert("新增失败!");            }          },          error: function () {            alert("系统错误!");          },        });      });

8.格式：

(1)

       x-www-urlencoded:       name=1&phone=2&address=3

(2)josn物件格式

       appplicatino/josn:       {"name" :"1", "phone" ' : "2" , ,"address":"3","adult mask":"4", "child mask":"5"}

偷吃步

package.json新增
"start": "nodemon index.js"

npm start