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

Node.js 심화과정

  • Upload
    -

  • View
    415

  • Download
    6

Embed Size (px)

Citation preview

Node.js 심화과정

신촌 크레바스 스터디 - 3주차 첫번째

로그인/회원가입, 이미지 업로드, 몽고DB

홍석유[email protected]

3주차 첫번째 스터디 ­ Node.js

express실제서비스구축

Express�generator를 활용해

초기파일구조를확립

express-eejs -clessmoca_server

3주차 첫번째 스터디 ­ Node.js

라우팅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);

->

3주차 첫번째 스터디 ­ Node.js

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

3주차 첫번째 스터디 ­ Node.js

./routes/users.jsusers�리소스 api

최상단

var express=require('express');var router=express.Router();varmysql =require('mysql');

var client=mysql.createConnection({host:'localhost',user:'root',database:'test'});

3주차 첫번째 스터디 ­ Node.js

모델/작가리스트 조회

users�리소스 api

/*모델/작가리스트조회(select)- user_type:M(모델),P(작가)+++나중에시간되면쿼리스트링더넣어서필터도만들기!!!*///moca.com/api/1/users?user_type=Mrouter.get('/',function(req,res,next){var user_type =req.query.user_type;if(user_type =='P'||'M'){client.query('SELECT*FROMuserWHEREuser_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)

3주차 첫번째 스터디 ­ Node.js

Users�생성(회원가입)

router/post(‘/’,�callback)

/*users생성(회원가입,insert)*///moca.com/api/1/usersrouter.post('/', function(req,res,next){var data={'username':req.body.username,'address':req.body.address,'price':req.body.price}

client.query('INSERT*intouserSET?',data,function(err,rows,fields) {if(err){conosole.log(err);}res.status(200);});});

3주차 첫번째 스터디 ­ Node.js

Users(회원정보수정)

router/put(‘/:user_id’,�callback)

/*모델/작가등록하기 &정보수정하기 -가입하기와다름.이들은가입을했기때문에 user_id를발급받았음 *///moca.com/api/1/users/2?user_type=Mrouter.put('/:user_id', function(req,res,next){var user_id =req.params.user_id;var user_type =req.query.user_type;

client.query('UPDATEuserSETuser_type =?WHEREid=?',[user_type,user_id],function(err,rows,fields) {if(err){console.log(err);}});});

3주차 첫번째 스터디 ­ Node.js

Users(전체유저조회)

Router/get(‘/’,�callback)

/*전체유저조회 -나중에 admin만들때활용 *///moca.com/api/1/usersrouter.get('/', function(req,res,next){var user_type =req.query.user_type;

client.query('SELECT*FROMuserWHEREuser_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});});});

3주차 첫번째 스터디 ­ Node.js

books�(전체사진첩 조회)

Router/get(‘/’,�callback)

/*books전체에대한조회(select)*/router.get('/', function(req,res,next){client.query('SELECTb.id ASbooks_id, b.username ASbooks_username, i.img_url ASimg_url_img_url FROMbooksbJOINimg_url i ONb.img_url1=i.id',function(err,rows,fields) {if(err){console.log(err);}

varbooks=[];rows.forEach(function(row){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 ­ 사용자의식별자

(아이디와비밀번호를브라우저에저장하지않는다)

3주차 첫번째 스터디 ­ Node.js

로그인 view(get)app.get('/auth/login', function(req,res){var output=`<h1>Login</h1><formaction='/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

3주차 첫번째 스터디 ­ Node.js로그인로직(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('Whoareyou?<ahref="/auth/login">login</a>');}});

var express=require('express');var session=require('express-session');var bodyParser =require('body-parser');

3주차 첫번째 스터디 ­ Node.js

세션var express=require('express');var session=require('express-session');var bodyParser =require('body-parser');varMySQLStore =require('express-mysql-session')(session);

app.use(session({secret:'djfivjdFDjfh1@1@$ei%#213#',resave:false,saveUninitialized:true,store:newMySQLStore({host:'localhost',port:3306,database:'test'})}));

3주차 첫번째 스터디 ­ Node.js로그인 + 세션

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('Whoareyou?<ahref="/auth/login">login</a>');}});

app.get('/welcome', function(req,res){if(req.session.displayName) {res.send(`<h1>Hello,${req.session.displayName}<h1><ahref="/auth/logout">logout</a>`);}else{res.send(`<h1>Welcome</h1><ahref="/auth/login">Login</a>`);}});

3주차 첫번째 스터디 ­ Node.jsDB에 세션저장하기

3주차 첫번째 스터디 ­ Node.js

md5

SHA256pbkdf2-password�npm

salt

if(uname ===user.username &&pwd ===user.password)

3주차 첫번째 스터디 ­ Node.js

passport�jsredis

Strategy:�local,�facebook

3주차 첫번째 스터디 ­ Node.js

Ejs로 json api 파싱하기

쿠키

Node.js 심화과정

신촌 크레바스 스터디 - 3주차 두번째

로그인/회원가입

홍석유[email protected]

3주차 두번째 스터디 ­ Node.js

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);

}});

3주차 두번째 스터디 ­ Node.js

pbkdf2-password�npm crypto

3주차 두번째 스터디 ­ Node.js

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(newLocalStrategy(function(username,password,done) {varuname =username;varpwd =password;

for(var i =0;i <users.length;i++){varuser=users[i];if(uname ===user.username) {returnhasher({password:pwd, salt:user.salt},function(err,

pass,salt,hash){if(hash===user.password) {done(null,user);}else{done(null, false);}});}}done(null, false);}));

3주차 두번째 스터디 ­ Node.js

Passport�- FBvar passport=require('passport');var FacebookStrategy =require('passport-facebook').Strategy;

app.get('/auth/facebook',passport.authenticate('facebook'));

app.get('/auth/facebook/callback',passport.authenticate('facebook',{successRedirect:'/welcome',failureRedirect:'/auth/login'}));

passport.use(newFacebookStrategy({clientID:'2925359214154649',clientSecret:'0966dbedda54bbafe984f7e12bcd0c40',callbackURL:"/auth/facebook/callback"},function(accessToken,refreshToken, profile,done) {var authID ='facebook:'+profile.id;

for(var i =0;i <users.length;i++){varuser=users[i];if(user.authId ===authId){returndone(null, user);}}

varnewuser ={'authId':authId,'displayName':profile.displayName};users.push(newuser);done(null,newuser);}));

3주차 두번째 스터디 ­ Node.js

Passport�- FB

3주차 두번째 스터디 ­ Node.js

Passport�- session

passport.serializeUser(function(user,done) {done(null, user.id);});

passport.deserializeUser(function(id,done) {for(var i =0;i <users.length;i++){varuser=users[i];if(user.id ===id) {done(null,user);}}});

app.use(passport.initialize());app.use(passport.session());

3주차 두번째 스터디 ­ Node.js

Passport�- sessionpassport.serializeUser(function(user,done) {done(null, user.id);});

passport.deserializeUser(function(id,done) {for(var i =0;i <users.length;i++){varuser=users[i];if(user.id ===id) {done(null,user);}}});

app.use(passport.initialize());app.use(passport.session());

3주차 두번째 스터디 ­ Node.js

Passport�- 구현예제app.get('/auth/login', function(req,res){var output=`<h1>Login</h1><formaction='/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><ahref="/auth/facebook">facebook</a>`;res.send(output);});

3주차 두번째 스터디 ­ Node.js

Ejs로 json api 파싱하기

쿠키

redis

3주차 두번째 스터디 ­ Node.js

Node.js 심화과정

신촌 크레바스 스터디 - 3주차 세번째

이미지 업로드

홍석유[email protected]

3주차 세번째 스터디 ­ Node.js

이미지업로드모듈

aws-sdk

formidable

multer

multer-s3

mysql 멀티이미지업로드

이미지업로드&�DB저장

3주차 세번째 스터디 ­ Node.js

싱글이미지 upload

var AWS=require('aws-sdk');AWS.config.region ='ap-northeast-1';var s3=newAWS.S3();

var formidable=require('formidable');var fs=require('fs');

var client=mysql.createConnection({host:'localhost',user:'root',database:'test'

});

<html><body><formaction="/api/1/books"method="post" enctype="multipart/form-

data"><input type="file"name="userfile"><input type="submit">

</form></body></html>

3주차 세번째 스터디 ­ Node.js

싱글이미지 uploadalt�+�tab

3주차 세번째 스터디 ­ Node.js

멀티이미지 upload

var express=require('express');var bodyParser =require('body-parser');varmulter =require('multer');varmulterS3=require('multer-s3');var AWS=require('aws-sdk');AWS.config.region ='ap-northeast-1';

var app=express();var s3=newAWS.S3();

app.use(bodyParser.json());

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title></title>

</head><body><formaction="/api/1/multers3"method="post"enctype="multipart/form-data">

<input type="file"name="userPhoto"multiple /><input type="submit">

</form></body></html>

3주차 세번째 스터디 ­ Node.js

멀티이미지 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);}})});