Day 49 (Node.js)

1.express-session设定

     var express = require('express');
     var session = require('express-session');
     var app = express();
     app.use(session({
          secret: 'asdoijisjdfiogjfdiogjdfoi,  //必要
          resave: true,
          saveUninitialized: true,

          cookie:{
               path: '/',
               httpOnly: true,
               secure: false,
               maxAge:5*1000
          }
     }))

(1)secret:型态为字串,作为Server端生session的签章 (必要)
(2)name:储存在Client端的key的名称·设为connect.sid
(3)resave:每次请求时,是否对session进行修改并覆写 (true,false)
(4)saveUninitialized:是否保存未初始化session (true,false)
(5)store:session的储存方式,预设为记忆体
Cookie: {
(6)path:cookie存放在Client端的路径·预设为/
(7)httpOnly:是否只能白Server更改Cookie
(8)secure:是否只在HTTPS协定中使用Cookie
(9)maxAge:设定cookie存活时间·以毫秒为单位(1000=1s)
}


2.不知道从何下手时,照使用者使用操作的顺序写下去

ex:先index > login > member


3.路径抓取次序

(1)会先抓public/index.html (静态路由)

    app.use(express.static(path.join(__dirname, 'public'))); 

(2)抓不到时抓views内 (动态路由)

    app.use('/', indexRouter); 
    app.use('/users', usersRouter); 

(3)routes内
(3-1)routes > index.js 下

    router.get('/', function(req, res, next) {
      res.render('index', { title: 'Express' });
    });

    module.exports = router;

(3-1)routes > users.js 下

    http://localhost:3000/users/login
    router.get('/login', function(req, res, next) {
      res.render('login',{}); //login网页 , {}login的内容
    });

    http://localhost:3000/users/member
    router.get('/login', function(req, res, next) {
      res.render('login',{}); //login网页 , {}login的内容
    });

**有时候读不出来是没有关掉重跑npm
ctrl + c > y
npm start

** 使用下列小技巧package.json内的start就不用一直重跑npm

  "scripts": {
    "start": "node ./bin/www"
  },

  "scripts": {
    "start": "nodemon ./bin/www"
  },

之後执行 npm start 效果同 nodemon index.js


4.session

(1)安装

npm i express-session

(2)引入MOD

   var session = require("express-session")

(3)定义session

    app.use(
      session({                       //session设定 ; secret必要
          secret: "passwordE$%*&%$*"    
      })
    )

(4)设定session

   router.post('/login', function(req, res, next) {
      //req.body.txtID的body需要express.urlencoded解码
      var userName = req.body.txtID;    
      req.session.userName = req.body.txtID; //设定session
      res.send('NAME:'+ userName); //login网页 , {}login的内容
   });

其余设定:

(5)转跳页面(则一)

  res.send('NAME:'+ userName);           //转跳login网页 , {}login的内容
  res.redirect("http://www.yahoo.com");  //转跳网页(与前择一)

(6)登入帐号後显示登入姓名

(6-1) index.ejs

  <h3>Hello!<%= userName %></h3>

(6-2) index.js

  res.render('index', { userName:req.session.userName || "Guset" });

Q:为何原本的档案(html),抓取资料的路径不会受影响(例如原档案引入jquery)
A:
1.绝对路径
2.因为views资料夹看不到(服务器端 因为是靠view:require>render连接的)

    app.set('views', path.join(__dirname, 'views'));  //连接view 服务器端
    app.set('view engine', 'ejs');

课後讨论

5.指令整理

npm init -y ==> package.json 产生
npm install ==>package.json 的dependencies内的套件全安装
npm install express ==> 安装express套件(全部都要用)
npm install ip ==> 安装ip套件
npm install ejs ==> 安装ejs套件(服务器网页显示前端)
npm install express-session ==> 安装express-session套件 (有登入都会用到、即时状态)

nodemon index.js ==> 随时跑程序(就不用一直 node XXX.js)

专案建立

express --ejs myPrject
express --ejs

暂停服务器(ejs > views用)

crtl + c :y
npm start ==>跑package.json内的start

** 小技巧package.json内的start

  "scripts": {
    "start": "node ./bin/www"
  },

  "scripts": {
    "start": "nodemon ./bin/www"
  },

之後执行 npm start 效果同 nodemon index.js


6. express套件类似MAMP小象


7. session 物件的概念

https://ithelp.ithome.com.tw/upload/images/20210812/2013768496ROo0UCZS.jpg


8. session安装顺序 使用於制作登入系统

(1)npm init -y ==> package.json 产生
(2)npm install express ==> 安装express套件
(3)express --ejs ==>新增ejs专案(服务器网页显示前端)
(4)npm install express-session ==>安装express-session套件(有登入都会用到、即时状态)


9.session与post的差异:

test1.php下

    session_start();
    
    $_SESSION['s1'] = "我是session";
    $_POST['p1'] = "我是post";
    $_GET['g1'] = "我是get";

    $s1 = $_SESSION['s1'];
    $p1 = $_POST['p1'];  or 表单给
    $g1 = $_GET['g1']; or 网址?g1=1231

    echo $s1.'<bry';
    echo $p1.'<br>';
    echo $g1.'<br>';

    header("Location: test2.php");//转跳至此

test2.php下

    session_start();

    $s1 = $_SESSION['s1'];
    $p1 = $_POST['p1'];  or 表单给
    $g1 = $_GET['g1']; or 网址?g1=1231

只有session有显示:我是session (被暂存到下一只档案)


10.会员登入的逻辑:

资料库(MySQL)抓资料
并与session配对
符合及即可登入并且session可以维持一段时间


<<:  第34天~

>>:  声明(claim)

[进阶指南] 错误边界 ( Day22 )

component 里 JavaScript 的错误常常会破坏 React 的内部 state,并...

Azure Developer Course

Azure Developer Course is for candidates who are w...

CISSP答题的思考重点

1.人员 > 流程 > 技术。人身安全永远排在第一顺位,是资安的黄金铁则! 2.组织所有...

[Day 12] -『 GO语言学习笔记』- for range 回圈

以下笔记摘录自『 The Go Workshop 』。 Go语言只支援一种回圈回圈叙述,就是for回...

Android Studio初学笔记-Day29-ButtomNavigationView

BottomNavigationView BottomNavigationView为底部导览按钮,及...