2-1. session 1 - intro
session : cookie를 기반으로 더 안전하고 많은 데이터를 저장하는 효과를 내는 방법
로그인 애플리케이션의 경우 사용자가 로그인을 하고 로그인이 성공했다면 다음에도 로그인을 할 수 있도록 값을 심어 놓을 수 있는데, 이는 보안에 이슈가 있다.
사용자의 컴퓨터와 서버가 서로 통신하는 과정에서 id나 비밀번호와 같은 중요한 정보가 왔다갔다 하는 것은 해킹의 위험이 있기 때문이다.
심지어 컴퓨터에 저장되어 있기 때문에 자리를 비운 동안 쿠키를 탈취해 갈 수 있다.
이러한 문제점을 보완하기 위해 서버 쪽에서 데이터를 저장할 수 있도록 세션을 사용한다.
사용자가 서버에 접속하면 서버는 데이터를 저장하는데, 쿠키 방식과는 다르게 오직 사용자의 식별자와 id값만을 저장하고 다른 정보들은 서버 쪽 데이터베이스에 저장된다.
나중에 사용자가 서버에 접속해 식별자를 전송하면 식별자에 해당하는 실제 데이터를 데이터베이스나 메모리에서 읽어 와서 전송한다.
2-2. session 2 - counter 1
cookie를 사용한다면 response의 헤더 정보에서 set cookie의 값을 확인하면 변하는 쿠키의 값을 확인할 수 있다.
session을 사용하면 connect.sid라는 값은 있지만 원래 입력한 count의 값은 보이지 않는다.
웹서버는 웹브라우저에 구체적인 값을 저장하는 대신 웹브라우저에 고유한 값을 전달한다.
고유한 값은 중복될 가능성이 거의 없다.
다음부터 서버에 접속할 때 sid 값을 서버로 전달하고, connect.sid 값이 같은 요청들은 같은 사용자의 접근이라고 간주한다.
cookie로 서버에 count 값을 전달하면 서버는 count 값에 1을 더한 결과를 응답해서 화면에 출력한다.
session으로 서버에 connect.sid 값을 전달하고, 그 값에 해당하는 결과를 응답한다.
id 값만 전달하기 때문에 더욱 안전하고, 데이터를 서버에 저장하기 때문에 많은 데이터도 저장할 수 있다.
2-3. session 3 - counter 2
npm install express-sesson --save를 먼저 콘솔에 설치해준다.
var express = require('express');
var session = require('express-session');
var app = express();
app.use(session({
secret: '1234DSFs@adf1234!@#$asd',
resave: false,
saveUninitialized: true
}));
app.get('/count', function(req, res){
if(req.session.count) {
req.session.count++;
} else {
req.session.count = 1;
}
res.send('count : '+req.session.count);
});
app.listen(3003, function(){
console.log('Connected 3003 port!!!');
});secret에 랜덤한 값을 넣어주고 resave는 false로 해서 접속할 때마다 새로운 session id를 발급하지 않고, saveUniniitialized를 통해 세션 아이디를 세션을 사용하기 전에는 발급하지 않도록 한다.
id로 접근한 사용자는 서버에 count라는 값으로 1이 저장이 되어 있고 그 값을 req.session.count 값을 받아올 수 있다.
session으로 사용자에게만 값을 전달하고 있기 때문에 다른 사용자는 그 값을 확인할 수 없다.
애플리케이션이 꺼지면 session의 값을 삭제하고, 다시 접속하면 새로운 session id를 부여한다.
실제 서비스에는 적용하지 않고, DB에 적용한다.
2-4. session 4 - login 1
session을 이용한 login 애플리케이션을 만들어 볼 것이다.
하지만 취약점이 있기 때문에 그대로 사용하지는 말고 인증 기능을 추가해서 사용할 것!
var express = require('express');
var session = require('express-session');
var app = express();
app.use(session({
secret: '1234DSFs@adf1234!@#$asd',
resave: false,
saveUninitialized: true
}));
app.get('/count', function(req, res){
if(req.session.count) {
req.session.count++;
} else {
req.session.count = 1;
}
res.send('count : '+req.session.count);
});
app.get('/auth/login', function(req, res){
var output = `
<form action="/auth/login" method="post">
<p>
<input type="text" name="username" placeholder="username">
</p>
<p>
<input type="password" name="password" placeholder="password">
</p>
<p>
<input type="submit">
</p>
</form>
`;
res.send(output);
});
app.listen(3003, function(){
console.log('Connected 3003 port!!!');
});<p></p> 태그로 멘트와 username, 비밀번호를 입력할 수 있는 textbox를 만든 뒤 submit 버튼을 만들어 action으로 auth의 login으로, post 방식으로 보낸다.
2-5. session 5 - login 2
var express = require('express');
var session = require('express-session');
var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.urlencoded({ extended: false }));
app.use(session({
secret: '1234DSFs@adf1234!@#$asd',
resave: false,
saveUninitialized: true
}));
app.get('/count', function(req, res){
if(req.session.count) {
req.session.count++;
} else {
req.session.count = 1;
}
res.send('count : '+req.session.count);
});
app.post('/auth/login', function(req, res){
var user = {
username:'egoing',
password:'111'
};
var uname = req.body.username;
var pwd = req.body.password;
if(uname === user.username && pwd === user.password){
res.redirect('/welcome');
} else {
res.send('Who are you? <a href="/auth/login">login</a>');
}
});
app.get('/auth/login', function(req, res){
var output = `
<h1>Login</h1>
<form action="/auth/login" method="post">
<p>
<input type="text" name="username" placeholder="username">
</p>
<p>
<input type="password" name="password" placeholder="password">
</p>
<p>
<input type="submit">
</p>
</form>
`;
res.send(output);
});
app.listen(3003, function(){
console.log('Connected 3003 port!!!');
});