Cookie

Knowledge Base-http

http = hyper text transfer protocal
ハイパーテキスト  htmlを表す
すなわち、httpはhtmlを伝送する通信プロトコル(protocal)である
httpはWebブラウザとWebサーバの要求と応答Headerを使用してデータを転送する
ブラウザ→サーバ:request
サーバ→ブラウザ:response
タイトルの表示方法:「チェック」>「ネットワーク」>「タイトル」>「タイトルの要求」.Response Header
応答ヘッダは、Set-Cookieを使用して要求ヘッダにCookieを渡す
httpには2つの特徴があります.
-接続プロトコルなし(接続なし)
クライアントがサーバに要求した場合、サーバに応答して接続を切断する処理方式.
-ステータス・プロトコルなし
クライアントと1回目の通信でデータを交換しても、2回目の通信で以前のデータは保持されません.

cookie

クライアントがローカルに格納する小文ファイル
クライアントのステータス情報をローカルに保存し、リクエスト時に参照します.
Ex.count練習-クライアント(ブラウザ)count=1を含むCookieのリクエストヘアをサーバに送信
Webサーバがcount=1を受信した場合、nodejsで+1し、応答ヘッダをクライアントに転送します.
Cookieはクライアントの情報を格納し,要求時にヘッダに含めて伝送する.

デフォルトCookie構文

expressでcookieを使用する方法:cookie-parserミドルウェアを使用する
ダウンロード方法:npm install cookie-parser-save
デフォルト設定:
var cookieParser = require('cookie-parser');
app.use(cookieParser());
デフォルトの構文:
res.cookie('count',1);
resヘッダ-cookieに設定:count=1転送
Cookie:count=1運転時のreqヘッダに存在する
req.cookies.count;
reqヘッダが受信したクッキーのcount値
Cookie練習1-count

var express = require('express');
var app = express();
var port = 3000;

var cookieParser = require('cookie-parser');
app.use(cookieParser());

app.get('/count', function(req,res){
  if(req.cookies.count){
    var count = parseInt(req.cookies.count);
  } else {
    var count = 0;
  }
  count = count +1;
  res.cookie('count',count); // set-cookie 설정
  res.send('count : '+count);
});
app.listen(port,function(){
  console.log(port+'번 포트에 연결되었습니다!!!');
}

Cookie練習2-myplaylist
ページ:ホームページ-歌/プレイリスト-myplaylist
曲をクリック→myplaylist/idでクッキー操作→myplaylistへ
対象文法などに注意して復習する

var express = require('express');
var app = express();
var port = 3000;
var cookieParser = require('cookie-parser');
app.use(cookieParser());

var songlist ={
  1:{title:'Top Of The World'},
  2:{title:'Last Night On Earth'}
};

app.get('/song',function(req,res){
  var output='';
  for(var name in songlist){
    output += `<li><a href="/myplaylist/${name}">${songlist[name].title}</a></li>`
    // 객체에 []연산자와 .연산자로 접근
  }
  res.send(`
    <h1>PlayList</h1>
    <ul>${output}</ul>
    <a href="/myplaylist">My playlist</a>`);
})

// 링크 클릭 -> 해당 id 에 + 1 하고 myplaylist로 리다이렉트 (사용자에게 안보임)
app.get('/myplaylist/:id', function(req,res){
  var id = req.params.id;
  if(req.cookies.songs){
    var songs = req.cookies.songs;
  } else {
    var songs = {};
  }
  if(!songs[id]){
    songs[id] = 0; 
		// 클래스에 데이터 추가 (없던 key에 값 대입-> 새로 생성됨)
		// songs 구조 : 첫번째 노래가 2번 재생 = 1:2
  }
  songs[id] = parseInt(songs[id]) + 1;
  res.cookie('songs',songs); // Set-Cookie : songs = {}
  res.redirect('/myplaylist');
});
app.get('/myplaylist',function(req,res){
  var songs = req.cookies.songs;
  if(!songs){ // 아무 링크도 누르지 않았을 때
    res.send('Empty!');
  } else {
    var output = '';
    for(var id in songs){
      output +=  `<li>${songlist[id].title}(${songs[id]})</li>`
    }
  }
  res.send(`<h1>My playlist</h1><ul>${output}</ul><a href="/song">song</a>`)
})
app.listen(port,function(){
  console.log(port+'번 포트에 연결되었습니다!');
})

保安

1)httpではなくhttpを使用する
httpはhttpにのみセキュアソケットが追加されたプロトコルです.
基本スケルトンまたは使用目的はhttpとほぼ同じです.
httpsの違いは、サーバとクライアント間のすべての通信コンテンツが暗号化されていることです.
2)暗号化Cookie値

var express = require('express');
var app = express();
var port = 3000;
var cookieParser = require('cookie-parser');
app.use(cookieParser('dsaf'));

app.get('/count', function(req,res){
  if(req.signedCookies.count){
    var count = parseInt(req.signedCookies.count);
  } else {
    var count = 0;
  }
  count = count +1;
  res.cookie('count',count,{signed:true});
  res.send('count : '+count);
});

app.listen(port,function(){
  console.log(port+'번 포트에 연결되었습니다!!!');
})

var express = require('express');
var app = express();
var port = 3000;
var cookieParser = require('cookie-parser');
app.use(cookieParser('아무값이나 입력하면 key로 사용됨'));

var songlist ={
  1:{title:'Top Of The World'},
  2:{title:'Last Night On Earth'}
};

app.get('/song',function(req,res){
  var output='';
  for(var name in songlist){
    output += `<li><a href="/myplaylist/${name}">${songlist[name].title}</a></li>`
  }
  res.send(`
    <h1>PlayList</h1>
    <ul>${output}</ul>
    <a href="/myplaylist">My playlist</a>`);
})

app.get('/myplaylist/:id', function(req,res){
  var id = req.params.id;
  if(req.signedCookies.songs){
    var songs = req.signedCookies.songs;
  } else {
    var songs = {};
  }
  if(!songs[id]){
    songs[id] = 0;
  }
  songs[id] = parseInt(songs[id]) + 1;
  res.cookie('songs',songs,{signed:true});
  res.redirect('/myplaylist');
});

app.get('/myplaylist',function(req,res){
  var songs = req.signedCookies.songs;
  if(!songs){ 
    res.send('Empty!');
  } else {
    var output = '';
    for(var id in songs){
      output +=  `<li>${songlist[id].title}(${songs[id]})</li>`
    }
  }
  res.send(`<h1>My playlist</h1><ul>${output}</ul><a href="/song">song</a>`)
})
app.listen(port,function(){
  console.log(port+'번 포트에 연결되었습니다!');
})