Node.js 심화과정

Node.js 심화과정
신촌 크레바스 스터디 - 3주차 첫번째
로그인/회원가입, 이미지 업로드, 몽고DB
홍석유
syhong0714@gmail.com

3주차 첫번째 스터디 Node.js
express
실제 서비스 구축
Express generator를 활용해
초기 파일구조를 확립
express -e ejs -c less moca_server

라우팅Routes라는 디렉토리를 만들고 API를 구조화
var routes = require('./routes/index');
var users = require('./routes/users');
var users2 = require('./routes/users2');
var books = require('./routes/books');
var proposals = require('./routes/proposals');
var ejsbooks = require('./routes/ejsbooks');
app.use('/', routes);
app.use('/users', users2);
app.use('/api/1/users', users);
app.use('/api/1/books', books);
app.use('/api/1/proposals', proposals);
->

API 리소스해당 리소스에 대한 작업은 해당 리소스에서
app.use('/', routes);
app.use('/users', users2);
app.use('/api/1/users', users);
app.use('/api/1/books', books);
app.use('/api/1/proposals', proposals);
GET, POST, PUT, DELETE

./routes/users.jsusers 리소스 api
최상단
var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var client = mysql.createConnection({
host: 'localhost',
user: 'root',
database: 'test'
});

모델/작가
리스트 조회
users 리소스 api
/* 모델/작가 리스트 조회(select) - user_type: M(모델), P(작가) +++ 나중에 시
간되면 쿼리스트링 더 넣어서 필터도 만들기!!! */
// moca.com/api/1/users?user_type=M
router.get('/', function(req, res, next) {
var user_type = req.query.user_type;
if (user_type == 'P' || 'M' ) {
client.query('SELECT * FROM user WHERE user_type = ?', user_type, function
(err, rows, fields) {
if(err) {
console.log(err);
}
varusers = [];
rows.forEach(function(row) {
users.push({
id : row.id,
username : row.username,
address : row.address,
price : row.price,
user_type : row.user_type
});
});
res.json({users: users});
});
}
});
router/get(‘/’, callback)

Users 생성
(회원가입)
router/post(‘/’, callback)
/* users 생성(회원가입, insert) */
// moca.com/api/1/users
router.post('/', function(req, res, next) {
var data = {
'username': req.body.username,
'address' : req.body.address,
'price' : req.body.price
}
client.query('INSERT * into user SET ?', data, function(err,
rows, fields) {
if (err) {
conosole.log(err);
}
res.status(200);
});
});

Users
(회원정보수정)
router/put(‘/:user_id’, callback)
/* 모델/작가 등록하기 & 정보수정하기 - 가입하기와 다름.
이들은 가입을 했기 때문에 user_id를 발급받았음 */
// moca.com/api/1/users/2?user_type=M
router.put('/:user_id', function(req, res, next) {
var user_id = req.params.user_id;
client.query('UPDATE user SET user_type = ? WHERE id = ?',
[user_type, user_id], function(err, rows, fields) {
if (err) {
console.log(err);
}
});
});

Users
(전체유저 조회)
Router/get(‘/’, callback)
/* 전체 유저 조회 - 나중에 admin 만들 때 활용 */
// moca.com/api/1/users
client.query('SELECT * FROM user WHERE user_type = ?',
user_type, function (err, rows, fields) {
if(err) {
console.log(err);
}
varusers = [];
users.push({
id : row.id,
username : row.username,
address : row.address,
price : row.price,
user_type : row.user_type
});
});
res.json({users: users});
});
});

books
(전체사진첩 조회)
Router/get(‘/’, callback)
/* books 전체에 대한 조회(select) */
client.query('SELECT b.id AS books_id, b.username AS
books_username, i.img_url AS img_url_img_url FROM books b
JOIN img_url i ON b.img_url1 = i.id', function (err, rows, fields) {
if(err) {
console.log(err);
}
varbooks = [];
books.push({
id : row.books_id,
username : row.books_username,
img_url : row.img_url_img_url
});
});
res.json({books: books});
});
});

3주차 두번째 스터디 Node.js
쿠키와 세션
데이터를 어디에 저장할 것인가?
보안, 데이터의 양, …
connect.sid 사용자의 식별자
(아이디와 비밀번호를 브라우저에 저장하지 않는다)

로그인 view(get)
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='useranme’></p>
<p><input type='password' name='password' placeholder='password’></p>
<p><input type="submit”></p>
</form>
`;
res.send(output);
});
template strings

로그인 로직(post)
app.post('/auth/login', function(req, res) {
var user = {
username: 'kevin',
password: '1234',
displayName: 'kevin hong'
};
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>');
}
});
var session = require('express-session');
var bodyParser = require('body-parser');

세션
var session = require('express-session');
var MySQLStore = require('express-mysql-session')(session);
app.use(session({
secret: 'djfivjdFDjfh1@1@$ei%#213#',
resave: false,
saveUninitialized: true,
store: new MySQLStore({
host: 'localhost',
port: 3306,
database: 'test'
})
}));

로그인 + 세션
app.post('/auth/login', function(req, res) {
var user = {
username: 'kevin',
password: '1234',
displayName: 'kevin hong'
};
var uname = req.body.username;
var pwd = req.body.password;
if(uname === user.username && pwd === user.password) {
req.session.displayName = user.displayName;
req.session.save(function() {
res.redirect('/welcome');
});
} else {
res.send('Who are you? <a href="/auth/login">login</a>');
}
});
app.get('/welcome', function(req, res) {
if (req.session.displayName) {
res.send(`
<h1>Hello, ${req.session.displayName}<h1>
<a href="/auth/logout">logout</a>
`);
} else {
res.send(`
<h1>Welcome</h1>
<a href="/auth/login">Login</a>
`);
}
});

DB에 세션 저장하기

md5
SHA256
pbkdf2-password npm
salt
if(uname === user.username && pwd === user.password)

passport js
redis
Strategy: local, facebook

Ejs로 json api 파싱하기
쿠키

신촌 크레바스 스터디 - 3주차 두번째
로그인/회원가입
홍석유

pbkdf2-password npm
var bkfd2Password = require("pbkdf2-password");
var hasher = bkfd2Password();
crypto
hasher({password:pwd, salt:user.salt}, function(err, pass, salt, hash) {
if(hash === user.password) {
done(null, user);
} else {
done(null, false);
}
});

pbkdf2-password npm crypto

passport.js
Strategy
Local Strategy Facebook Str
Google Str
Twitter Str
Kakao, Naver, …

Passport - local
var passport = require('passport');
var LocalStrategy = require('passport-local').Strategy;
app.post(
'/auth/login',
passport.authenticate(
'local',
{
successRedirect: '/welcome',
failureRedirect: '/auth/login',
failureFlash: false
}
)
);
passport.use(new LocalStrategy(
function(username, password, done) {
varuname = username;
varpwd = password;
for (var i = 0; i < users.length; i++) {
varuser = users[i];
if(uname === user.username) {
return hasher({password:pwd, salt:user.salt}, function(err,
pass, salt, hash) {
if(hash === user.password) {
done(null, user);
} else {
done(null, false);
}
});
}
}
done(null, false);
}
));

Passport - FB
var passport = require('passport');
var FacebookStrategy = require('passport-
facebook').Strategy;
app.get(
'/auth/facebook',
'facebook'
)
);
app.get(
'/auth/facebook/callback',
'facebook',
{
successRedirect: '/welcome',
failureRedirect: '/auth/login'
}
)
);
passport.use(new FacebookStrategy({
clientID: '2925359214154649',
clientSecret: '0966dbedda54bbafe984f7e12bcd0c40',
callbackURL: "/auth/facebook/callback"
},
function(accessToken, refreshToken, profile, done) {
varauthID = 'facebook:'+profile.id;
varuser = users[i];
if (user.authId === authId) {
return done(null, user);
}
}
varnewuser = {
'authId' : authId,
'displayName' : profile.displayName
};
users.push(newuser);
done(null, newuser);
}
));

Passport - FB

Passport - session
passport.serializeUser(function(user, done) {
done(null, user.id);
});
passport.deserializeUser(function(id, done) {
varuser = users[i];
if(user.id === id) {
done(null, user);
}
}
});
app.use(passport.initialize());
app.use(passport.session());

Passport - 구현예제
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='useranme'></p>
<p><input type='password' name='password'
placeholder='password'></p>
<p><input type="submit"></p>
</form>
<a href="/auth/facebook">facebook</a>
`;
res.send(output);
});

Ejs로 json api 파싱하기
쿠키
redis

신촌 크레바스 스터디 - 3주차 세번째
이미지 업로드
홍석유

3주차 세번째 스터디 Node.js
이미지업로드 모듈
aws-sdk
formidable
multer
multer-s3
mysql 멀티이미지업로드
이미지업로드 & DB저장

싱글이미지 upload
var AWS = require('aws-sdk');
AWS.config.region = 'ap-northeast-1';
var s3 = new AWS.S3();
var formidable = require('formidable');
var fs = require('fs');
var client = mysql.createConnection({
host: 'localhost',
user: 'root',
database: 'test'
});
<html>
<body>
<form action="/api/1/books" method="post" enctype="multipart/form-
data">
<input type="file" name="userfile">
<input type="submit">
</form>
</body>
</html>

싱글이미지 upload
alt + tab

멀티이미지 upload
var multer = require('multer');
var multerS3 = require('multer-s3');
var AWS = require('aws-sdk');
AWS.config.region = 'ap-northeast-1';
var app = express();
var s3 = new AWS.S3();
app.use(bodyParser.json());
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="/api/1/multers3" method="post"
enctype="multipart/form-data">
<input type="file" name="userPhoto" multiple />
<input type="submit">
</form>
</body>
</html>

멀티이미지 upload
app.get('/multers3', function(req, res) {
res.sendFile(__dirname + '/public/uploadform.html');
});
app.post('/api/1/multers3', upload.array('userPhoto', 10),
function(req, res, next) {
res.send('uploaded!');
});
var upload = multer({
storage: multerS3({
s3 : s3,
bucket : 'mocatest',
acl : 'public-read',
key : function(req, file, callback) {
callback(null, file.originalname);
}
})
});

Node.js 심화과정

More Related Content

What's hot (20)

Viewers also liked (8)

Similar to Node.js 심화과정 (20)

Node.js 심화과정