전체 글
-
세션, JWT, OAuth등 회원인증 방법론Node.js,MongoDB 2022. 4. 12. 13:09
회원인증 방법엔 3가지가 있다. 1. session-based 어떤 사람이 form에서 로그인을 하면, 서버에서 쿠키(브라우저에 저장할 수 있는 긴 문자열)를 발행한다. 이 쿠키엔 loginUser1인 세션아이디를 저장한다. 즉, 서버 메모리에 loginUser1은 로그인을 했었다는 내용을 쿠키로 주고, 브라우전 이 쿠키를 저장한다. 그리고, 로그인이 필요한 활동을 하면 서버에 자동으로 쿠키를 보내지며 서버에서 쿠키를 찾아서 로그인했던 사람을 찾는다. 장점으론 로그인 상태를 저장하는 것이다. 2. token-based (JWT) 어떤 사람이 form에서 로그인을 하면, 서버에서 웹토큰이라는 JSON Wen Token(긴 문자열)을 발행해준다. 사용자는 브라우저에 저장하고, 로그인이 필요한 활동을 하면 웹..
-
글 수정하기 (edit기능)Node.js,MongoDB 2022. 4. 12. 02:58
수정하기 버튼을 만들어서, 수정하기 버튼을 누르면 원래 있던 글의 제목과 날짜가 뜨며, 수정할 수 있게끔 만들어보자. /edit이라는 url로 만들것이므로 먼저, server.js에 app.get('/edit/:id', function(요청, 응답){ db.collection('post').findOne({ _id : parseInt(요청.params.id) }, function(에러, 결과){ if (결과 == null) { return 응답.render('error.ejs'); } else { console.log(결과); 응답.render('edit.ejs', { data : 결과 }); }; }); }); 이렇게 적어서, 1번글을 수정하려면 /edit/1, 2번글을 수정하려면 /edit/2 이렇게..
-
css 사용Node.js,MongoDB 2022. 4. 8. 16:50
html파일을 꾸밀 때 css를 사용하려면 public폴더를 만들고 그 안에 css파일을 넣어야한다. 그리고 server.js 에 미들 웨어 코드를 추가해야한다. app.use('/public', express.static('public')); 그리고 nav에 링크를 달건데 nav는 파일마다 있으므로 Write 파일마다 href경로를 수정해주기엔 번거롭다. 그래서 nav태그를 조립식으로 첨부할 수 있다. views폴더에 nav.html을 생성해주고 그 안에, nav내용들을 작성해준다. 그리고 .ejs파일들에는 이런 식으로 include를 이용해 적어주면 된다. .ejs에만 가능하므로 html파일들에는 직접 nav내용을 복붙해주면 된다.
-
URL 파라미터Node.js,MongoDB 2022. 4. 7. 13:48
각 글을 누르면 상세페이지로 이동하게 만들어보자. 상황을 보면 글번호1을 누르면 detail1.ejs로 가고 글번호 4를 누르면 detail.ejs로 가야한다. 파일을 여러개 만드는 것도 방법이겠지만 간단하게 만들 수 있다. // /detail로 접속하면 detail.ejs보여줌 detail1로 접속시 detail1.ejs로 가게하기 app.get('/detail/:id', function(요청, 응답){ //:id를 입력하면 detail/어쩌구로 GET요청을 하면 이란 뜻임 URL Parameter로 불림 db.collection('post').findOne({ _id : parseInt(요청.params.id) }, function(에러, 결과){ //요청.params.id는 파라미터 중 :id라는 ..
-
ajax로 삭제요청Node.js,MongoDB 2022. 4. 6. 02:31
삭제를 할 때 DELETE요청을 하면 된다. form태그의 method="post"를 delete로 바꾸면 되지 않을까 생각할 수 있지만, html상에서 delete요청을 할 순 없다. 그래서, 2가지 방법이 있다. 1. method-override라이브러리를 사용하거나 2. js ajax를 이용하거나 2번을 이용해서 delete를 해보자. Ajax의 가장 큰 장점은 새로고침 없이 서버에 요청하는걸 도와준다. 서버에서 가져온 할일 리스트 할일 제목 : 할일 마감날짜 : 삭제 먼저, list를 이쁘게 만들어주고 $.ajax({ method : 'DELETE', url : '요청할경로', data : '요청과 함께 보낼 데이터' }) 제이쿼리cdn을 먼저 써주고, 아래에 script태그를 만들어 위처럼 입력..
-
게시물 각각에 번호달기(numbering)Node.js,MongoDB 2022. 4. 4. 13:42
글을 저장할 때 꼭 번호를 달아줘야 한다. 몽고db에 counter 라는 새로운 connection을 만들어준다. 그리고INSERT DOCUMENT를 이용해 기본값을 만들어준다. totalPost를 0으로 해서 게시물이 추가되면 여기에 1씩 더해지도록 만들면 된다. app.post('/add', function(요청, 응답){ 응답.send('전송완료'); db.collection('counter').findOne({ name: '게시물갯수'}); db.collection('post').insertOne({ _id : 총게시물갯수 + 1, 제목 : 요청.body.title, 날짜 : 요청.body.date}, function(에러, 결과){ console.log('저장완료'); }); }); 그 다음, ..
-
HTML에 DB데이터 넣기Node.js,MongoDB 2022. 4. 4. 10:29
MongDB에 넣은 할일 제목 : ? 할일 마감날짜 : ? 이런 데이터들을 위의 html에 직접 넣어 이쁜 UI를 만들 때 EJS라는 라이브러리를 사용한다. EJS는 html을 좀 더 쓰기 쉽게 도와주는 전처리엔진이다. npm install ejs 터미널에 이렇게 입력해 우선 라이브러리를 설치해준다. 그 다음, server.js 상단에 app.set('view engine', 'ejs'); 이렇게 입력해주면 준비가 된다. 그리고 사용하려던 list.html파일 이름을 list.ejs로 바꿔준다. 그 다음, server.js에 아래처럼 입력한다. // /list로 GET요청으로 접속하면 // 실제 DB에 저장된 데이터들로 예쁘게 꾸며진 html로 보여줌 app.get('/list', function(요청,..
-
MongoDB에 자료저장Node.js,MongoDB 2022. 4. 1. 17:27
MongoClient.connect('mongodb+srv://ross1222:dlwnsdud12@cluster0.ivzfq.mongodb.net/todoapp?retryWrites=true&w=majority', function(에러, client) { //연결되면 할 일 //에러라는 파라미턴 에러가 발생하면 어떤 유형인지 알려줌 if(에러){return console.log(에러)} app.listen(8080, function(){ console.log('listening on 8080') }); }) 먼저, 저번 시간에 작성한 코드에서 에러라는 파라미턴 에러가 발생시에 어떤 유형인지 알려주는 역할을 한다. 그리고, 위에와 같이 if문을 추가하면 에러가 났을 때, 어떤 유형인지 알려주게 된다. 이제..