유튜버 생활코딩님의 강의를 정리한 것입니다.
https://www.youtube.com/watch?v=ZtthPO1qVZQ&list=PLuHgQVnccGMBnrdKRODJmbH7UZ2A48LBK&index=30
get과의 비교를 통한 post 이해하기
- post 는 사용자가 서버에 정보를 전달하는 경우에 사용하는 라우팅 메서드
예) 로그인 정보를 전달하거나 새로운 게시물을 등록하는 등의 경우 - 그러나, 반드시 post를 써야만 사용자의 정보를 서버에 전달 할 수 있는 것은 아니다.
- get을 이용해 할 수도 있다.
- get을 이용하는 방법을 알아보자
get을 이용해 사용자가 입력한 정보를 서버로 보내기
1. html에서(플랫폼, pug파일)에서 form태그를 이용한다.
2. form태그는 html파일의 일부를 하나로 묶어서 활용할 수 있게 하는 태그임.
3. form태그 속성에 action='경로'와 method=get 를 추가하면 제출버튼을 눌렀을 때 해당 경로로 접속하게됨
(form태그의 method 속성은 get이 디폴트임. 따라서 생략 가능)
4. 즉 해당 경로로 get요청 됨.
5. 입력용 태그의 속성에 name='keyname(지정)'을 추가
(사용자가 화면에서 정보를 입력한다는 것은 html파일에서 입력용 태그인 input이나 textarea등이 쓰인다는 것임을 잊지 말자.)
6. 이때, 입력한 내용들은 url의 querystring이 됨.
즉, req.query의 key와 value로 저장됨.
7. 응답의 예시) res.send(/exampleurl, functon(req.res) {
var 입력1 = req.query.입력1
var 입력2 = req.query.입력2
res.send(입력1+,+입력2)
}
//입력한 뒤 제출버튼을 누르면 사용자가 입력한 입력1과 입력2를 화면에 띄워줌.
위에서, get을 통해 사용자가 입력한 정보를 서버에 보내는 방법을 알아보았다.
이제 post를 이용한 방법을 알아보자.
1. 우선 post방식은 get과 좀 다름.
2. 사용자 입력 정보를 req요청에 담고자 할 때, 또 다른 모듈인 body-parser패키지를 설치해주어야 함.
(get과 달리 express만으로는 못한다는 점!)
(참고로, 입력정보에 관계없는 값을 응답할때는 ,즉 사용자가 입력한 정보를 응답과정에서 다루지 않는경우는 body-parser설치 할 필요 X)
3. 다음의 코드를 서버에서 작성 :
var bodyParser = require('body-parser') //설치
app.use(bodyParser.urlencoded({extended:false}) //이거 해줘야함. 대충 'app에서 괄호안의 기능을 쓸 수 있도록 추가한다'임. 그냥 외우기. 고수들이 만들어놓은거
3. get과 마찬가지로, pug파일에서 form태그를 이용하며 입력태그의 속성 name='keyname'써준다.
4. 이때, get요청할 때와 달리, form태그의 속성 method=post로 써주어야 함.
5. 그러면 사용자 입력 값이 req.body.keyname의 value로 저장됨!!
(req.query아니고 req.body임 주의)
post방식과get방식의 핵심적 차이는 사용자가 보내고자 하는 정보가 url에 표시되느냐 안되느냐 임.
post방식은 url에 포함되지 않는 반며, get요청은 url에 정보가다 담김.
따라서, 아이디와 비밀번호를 입력하여 서버에 전달하고자 하는 경우 get방식을 이용하는 것은 적절하지 않음.
참고로, 그렇다고 해서(url에 정보를 나타내지 않는다고 해서) post방식이 보안상 안전한 것은 아님. 정보를 빼낼 수 있음.
