반응형
Node.js의 기본적인 개념 및 Express가 설치되어있다는 전제하에 포스팅 내용이 전개됩니다.
환경이 구성되어있지 않으면 아래의 포스팅을 확인해주세요.
라우팅 메소드 구문(Route methods syntax)
기본 구조
- 라우팅 메소드 : HTTP method 중 하나(GET, PUT, POST, DELTE)에서 파생되어 인스턴스에 부여하는 것
라우팅 메소드 구문
// GET method route
app.get('경로', function (요청, 응답) {
응답.send('GET request to the homepage')
})
// POST method route
app.post('경로', function (요청, 응답) {
응답.send('POST request to the homepage')
})
- 경로 : 요청에 대한 응답을 지정한 경로에서 수행
- 요청, 응답 : 요청이 이루어질 경우, 요청된 값과 응답된 값을 저장하는 변수
- 응답.send(내용) : 요청의 응답된 내용을 정의하여 사용자에게 보여주는 함수
- 포스팅에서는 GET 방식을 다루고 있지만, POST도 같은 방식으로 사용 가능함
요청.params
app.get('경로/:파라미터', function (요청, 응답) {
const 변수 = 요청.params
응답.send(변수)
})
- 요청시 경로 뒤에 정의한 파라미터의 값을 저장하는 개체
- 요청시 경로 뒤에 '/값' 의 형식을 통해 파라미터의 값을 전달
- 경로 설정시 정의한 경로 뒤에 '/:파라미터' 정의
- .params 개체를 활용하여 다양한 값을 통해 동적으로 구성할 수 있음
요청.query
app.get('경로', function (요청, 응답) {
const 변수 = 요청.query
응답.send(변수)
})
- 요청시 경로 뒤에 정의한 키값 형태의 파라미터의 값을 저장하는 개체
- 요청시 경로 뒤에 '?키1=값1&키2=값2' 의 형식을 통해 쿼리 문자열의 값을 전달
- .query 개체를 활용하여 다양한 값을 통해 동적으로 구성할 수 있음
Response methods (응답 방식)
- 응답 객체의 메서드(res로 정의, 위의 코드에서는 '응답'로 정의함)
- 클라이언트에 응답을 전송하여 요청과 응답 사이클 종료
- 메서드가 호출되지 않으면 클라이언트 요청은 정지된 상태로 유지
res.filength() | 파일을 다운로드하도록 지시합니다. |
res.end() | 응답 프로세스를 종료합니다. |
res.json() | JSON 응답을 보냅니다. |
res.jsonp() | JSONP 지원을 포함한 JSON 응답을 보냅니다. |
res.filength() | 요청을 리다이렉트합니다. |
res.filength() | 뷰 템플릿을 렌더링합니다. |
res.send() | 다양한 유형의 응답을 보냅니다. |
res.send File() | 파일을 옥텟 스트림으로 전송합니다. |
res.sendStatus() | 응답 상태 코드를 설정하고 해당 문자열 표현을 응답 본문으로 전송합니다. |
경로 설계
특정 경로로 이동하기
// 해당 경로(/greeting)에 대한 GET 요청 경로 정의
app.get('/greeting', function (req, res) {
res.send('Hello Express!')
})
- 기본경로/greeting 경로를 접속하면 'Hello Express' 라는 문구 출력
특정 경로에 HTML 태그 포함하기
// 해당 경로(/tag)에 대한 GET 요청 경로 정의
// HTML 파일이나 태그 사용 가능
app.get('/tag', function (req, res) {
res.send('<h1>Hello Express!</h1>')
})
특정 경로에 Path 사용하기 (파라미터 값 전달)
// 해당 경로(/userPath)에 대한 GET 요청 경로 정의
// path 사용, 파라미터 값 이용
app.get('/userPath/:name', function (req, res) {
const userName = req.params
res.send(userName)
})
- Path 사용 : 경로 뒤에 '/값' 입력
- .params : 명명된 경로 매개 변수(파라미터)에 매핑된 속성을 포함하는 개체
- .params 예시를 통해 절차 이해하기
- /userPath 경로에 /name:과 같은 경로 정의
- 클라이언트가 /userPath/name 요청
- .params는 'name' 속성으로 설정된 객체 생성
- /userPath 경로에서 명명된 매개 변수 사용 가능
특정 경로에 Query String 사용하기 (파라미터 값 전달)
// 해당 경로(/userQuery)에 대한 GET 요청 경로 정의
// query string 사용
app.get('/userQuery', function (req, res) {
const userName = req.query
res.send("userAge : " + userName.age + "<br>userBirthday : " + userName.birthday)
})
- 쿼리 스트링 (Query String) 사용 : 경로 뒤에 '?매개변수=값' 입력
- .query : 요청한 URL의 쿼리 문자열 매개 변수(파라미터)에 대한 속성이 있는 개체가 포함된 개체
- .query 예시를 통해 절차 이해하기
- /userQuery 경로에 물음표(?) 입력 후 전달할 키와 값(age=34) 정의
- 전달할 키값이 여러개일 경우 '&'를 사용하여 구분
- 예시) /userQuery?age=34&name=eunbyeol
- 클라이언트가 /userPath 경로에 요청
- .query는 물음표 뒤에 정의한 키값을 속성으로 설정된 객체 생성
- /userQuery 경로에서 명명된 쿼리 스트링 매개 변수 사용 가능
- /userQuery 경로에 물음표(?) 입력 후 전달할 키와 값(age=34) 정의
파라미터를 이용하여 상황에 따른 결과 반환하기
- 패스(Path) 혹은 쿼리 스트링(Query String)을 이용하여 전달받은 파라미터의 값으로 상황에 따른 결과를 반환해보기
- 해당 포스팅에서는 패스 이용
- 소스 코드는 자바스크립트 기반이기 때문에 자바스크립트를 사용하여 작성할 수 있음
// 해당 경로(/path)에 대한 GET 요청 경로 정의
// path 사용, 파라미터 값을 이용하여 상황에 따른 결과 반환
app.get('/path/:user', function (req, res) {
const { user } = req.params
if (user == "eunbyeol") { res.send("은별님 환영합니다.") }
else { res.send("승인되지 않은 사용자입니다.") }
})
- 경로에 "eunbyeol"을 입력하였을 경우
- 경로에 "admin"을 입력하였을 경우
전체 소스 코드
// express 프레임워크 객체 생성
const express = require('express')
// express의 새 인스턴스 할당
const app = express()
// 루트 경로에 대한 GET 요청 경로 정의
app.get('/', function (req, res) {
res.send('Hello World')
})
// 해당 경로(/greeting)에 대한 GET 요청 경로 정의
app.get('/greeting', function (req, res) {
res.send('Hello Express!')
})
// 해당 경로(/tag)에 대한 GET 요청 경로 정의
// HTML 파일이나 태그 사용 가능
app.get('/tag', function (req, res) {
res.send('<h1>Hello Express!</h1>')
})
// 해당 경로(/userPath)에 대한 GET 요청 경로 정의
// path 사용, 파라미터 값 이용
app.get('/userPath/:name', function (req, res) {
const userName = req.params
res.send(userName)
})
// 해당 경로(/userQuery)에 대한 GET 요청 경로 정의
// query string 사용
app.get('/userQuery', function (req, res) {
const userName = req.query
res.send("userAge : " + userName.age + "<br>userBirthday : " + userName.birthday)
})
// 해당 경로(/path)에 대한 GET 요청 경로 정의
// path 사용, 파라미터 값을 이용하여 상황에 따른 결과 반환
app.get('/path/:user', function (req, res) {
const { user } = req.params
if (user == "eunbyeol") { res.send("은별님 환영합니다.") }
else { res.send("승인되지 않은 사용자입니다.") }
})
// 해당 포트로 서버를 시작하고 들어오는 요청 수신
app.listen(3000, () => {
console.log('Server listening on port 3000');
});
참고
반응형