즐코

출처 : http:// https://inpa.tistory.com/entry/SOCKET-%F0%9F%93%9A-WS-%EC%9B%B9%EC%86%8C%EC%BC%93-%EC%82%AC%EC%9A%A9%ED%95%B4%EB%B3%B4%EA%B8%B0?category=914796#thankYou 여태 http 통신만 배우다 보니 웹소켓이란 걸 인지하지 못했다. 늘 우리가 접하는 채팅, 경매, 주식 사이트, 구글docs 등 실시간으로 통신이 필요할 경우엔 이 웹소켓 프로토콜을 사용한다. http 통신은 클라이언트가 요청을 해야만 서버가 응답을 준다. 요청 없이는 서버는 아무것도 응답해주지 않는다. 이 websocket 통신은 그렇지 않다. 양방향이 가능하다. 서버도 클라이언트의 요청없이 선톡이 가능하다. ..

1. 초반 설정 https://developers.kakao.com/ kakao developers 가입부터 해야하고, 그 뒤로 코드 치기 전에 초반 설정이 많다. 코드 상에 꼭 필요한 3가지를 초반 설정 시에 메모장에 적어둘 것 1/ REST API 앱키 (문서를 보다보면 client id라고 표현하는데 같은 단어임) 2/ Redirect URI : 이건 내가 정하는 거긴 한데, 정했으면 다시 찾기 귀찮으니 기록해두기 3/ Client Secret : 소금과 같은 것 1. 상단 오른쪽 > 내 애플리케이션 > 애플리케이션 추가하기 > 사진 및 정보 입력 (저 사진은 카카오 로그인 눌렀을 때 보이는 사진이라고 하니 실무에선 회사 로고를 쓴다고 함) 2. 내 애플리케이션 클릭 > 메인 화면에 앱키가 바로 뜸..

multer 라이브러리 사용법 - 하나의 파일 업로드 - 다수의 파일 업로드 - file input이 여러개일때 파일 업로드 - 비동기 파일 업로드 파일 업로드도 텍스트를 보내주는 것과 똑같다. 컴퓨터는 0,1밖에 모르니 파일,사진을 보내도 텍스트 파일로 본다. 파일 업로드에는 multer 라이브러리를 사용하는 걸 배웠다. npm install multer const multer = require('multer') 우선 파일을 업로드할 html파일을 작성해보자. 늘 하듯 form 형태로 보낸다. 다만, 여기서 이전과 다른게 있다면, enctype 이다. 아래와 같이 3가지 옵션이 있는데, default값이 application/x-www-form-urlencoded여서 이전엔 이 부분에 대해서 신경쓰지 ..

node.js 내부 라이브러리 path와 대표적인 함수들을 배워보았다. 이것들을 이용해서 파일 업로드 라이브러리 multer를 배웠다. 이건 다음 포스팅에서 정리할거임 내부 라이브러리라 npm install path 같은 거 할 필요 없다. 그냥 바로 const path = require('path') 하면 됨 __dirname 현재 실행 중인 파일의 절대경로가 찍힌다. 각 코드 실행환경이 윈도우냐 리눅스에 따라 결과물이 살짝 다르다. 윈도우(역슬래쉬) / 리눅스(정슬래쉬) path.join() vs path.resolve() 공통점 : 둘 다 인자로 경로들을 받아서 그걸 합쳐가지고 문자열 형태로 합친 경로를 리턴해준다. (파일명을 넣어도 됨) 아래 결과물을 보면 절대경로(__dirname) + 파일명(..

우선, 서버쪽에 idcheck라는 라우터를 만들어준다. 전체적으로 적용할 솔루션은 아래와 같다. 사용자가 input에 입력한 id를 가져와서, 우리가 가지고 있는 사용자 정보 (user)와 비교하여 아이디가 같은 게 있다면, item에 담아준다. result란 값을 우선 1로 잡아주고, (let result = 1) 중복된 아이디가 있다면 (item이 undefined가 아닐 때) result=2로 응답에 담아서 보내준다. 중복된 아이디가 없다면 (item이 undefined 라면) result=1로 응답에 담아서 보내준다. 이 때, response를 보내줄 때, 즉 통신을 할 때는 객체형태의 데이터는 보내줄수 없다. 따라서, json형태로 바꾸어서 보내주는 게 포인트이다. res.send(JSON.st..

저번 미니 프로젝트 복습 겸 사용자계정을 DB에서 당겨오는 방식으로 JWT 로그인 기능 구현을 연습해보았다. 사실 router 분리를 해야하지만 로그인 기능만 구현할 거니까 server.js 파일에 다 때려박았다. 이번엔 async await를 써보자고 마음먹었다.. 우선 써보기전에 원래 했던대로 콜백지옥을 만들어보앗다. pool.getConnection의 인자로 콜백함수가 들어가고, conn.query에도 3번째 인자로 콜백함수가 들어가니 그안에서 if문까지 써버리면 엄청난 depth가 생긴다. 특히, pool과의 connection을 다시 return해주는 conn.release()를 어디 괄호뒤에 써야할지 찾는 것도 힘들다. 그래서 async, await으로 바꿔보았다. 어떻게 바꿀지 감이 안잡혀서..

buffer = 컴퓨터가 이해할 수 있는 binary data (이진수 데이터)의 스트림을 직접 다루기 위해 node.js에서 제공해주는 API다 = 브라우저에서 사용하는 JS에는 없다. buffer가 뭔지 알기 전에 기본적인 걸 잠깐 짚고 넘어가야겠다. - Character Set 문자 집합 각각의 문자를 컴퓨터가 이해할 수 있도록 숫자로 정의해놓은 규칙표 (유니코드, 아스키코드 등) * charCodeAt() 메소드 JS 메소드 중에 .charCodeAt()를 활용하면 각 문자를 유니코드표에 맞춰 숫자로 출력해준다. 문자.charCodeAt(0) 하면 문자열의 0번째인 y를 나타내는 숫자를 출력해준다. - 문자인코딩 위에선 문자를 숫자로 변환했다면 (y->121) 이젠 컴퓨터가 정말로 알아먹을 수 있..

어떤 웹사이트던간에 회원/비회원에 따라 페이지가 구분된다. (마이페이지, 회원정보 수정, 게시판 페이지 등..) 즉, 서버는 사용자를 구분하여 사이트 내 각각의 기능들을 허용해줄지 말지 결정해서 응답을 해야한다. 그래서 웹사이트 내에서 사용자가 페이지 이동 시, 서버가 각 페이지에서 이 사용자를 기억하기 위해 즉, 사용자의 로그인 상태 유지를 위해 필요한게 인증과 인가이다. 1. 인증(Authentication) & 인가(Authorization) 과 세션 리마인드.. 인증(Authentication) 인가(Authorization) 사용자의 id와 pw를 확인해 회원임을 인증하는 과정 (로그인/회원가입) 로그인을 하고나서 (회원임을 인증하고 난 이후에) 한 웹사이트 내에서 여러 페이지/서비스를 이용할 ..

백엔드 테스트 하는 방법?! 어제 git/github을 통해서 처음으로 다른 사람들과 같이 코딩을 해보았다. 나는 프론트, 다른 두 분은 백엔드였다. 근데 git으로 branch를 나눠서 하고 있는 와중에 의문점이 든게 프론트를 맡은 내가 html파일을 만들어주지 않았는데, 백엔드하시는 분들이 어떻게 브라우저 화면없이 각 라우터들의 동작을 확인하지 싶었다... 그래서 오늘은 백엔드가 이 요청/응답 동작을 어떻게 테스트 하는지에 대해 배웠다. 즉, html (화면)이 완성되기 전에 post 요청이 잘 받아지는지, 데이터 전달이 잘 되어는지 우리가 임의로 테스트가 가능하다. 우선 여러 방법이 있겠지만 curl 을 활용하는 법 그리고 postman 툴에 대해 알아보았다. 1/ curl 커맨드라인 상의 툴, 커..

1/ session으로 로그인 기능 구현 2/ 라우터,미들웨어 분리하기 1/ session으로 로그인 기능 구현 #1. 로그인 시 사용자의 정보를 쿠키와 함께 세션에 담을 준비를 하자. 우선 이제 슬슬 코드를 조금 간단하게 쓰는 연습을 해야함 let userid = req.body.userid / let userpw = req.body.userpw 대신 let {userid,userpw}=req.body 로 줄이기 for문+if문 조합 대신 filter 메소드 써서 true인 값만 걸러내기 일단, filter는 배열을 return하니까, loginData를 [ ] 대괄호로 감싸야 배열이 통째로 리턴되지않고, 배열 안의 값만(여기선 객체) 출력된다. #2. 로그인 성공 시 vs 로그인 실패 시 응답을 나누..