express 모듈 사용하기
이전의 http 모듈로 서버 구동하기 포스트 에서는, require('http') 를 통하여 http 모듈을 만들고, 각 기능을 구현해 보았었다.
이번에는 이 http 모듈을 불러오는 대신에, express라는 외부 모듈을 사용해서 서버를 구동해본다.
우선, npm-express 페이지에서, express에 대한 설치방법과, 예시들을 확인한다.
정보에 따르면 express는 터미널에서 npm i express 명령어를 이용해 설치한다.
다음은 express 모듈의 공식 페이지에 표시된 예제이다.
const express = require('express') // 외부 모듈 불러오기
const app = express()
app.get('/', function (req, res) {
res.send('Hello World')
})
app.listen(3000)마찬가지로, require을 통해 모듈을 불러오고, 메소드를 통해 서버를 동작한다.
app.get() 은 HTTP 메소드에서, GET을 나타내는 메소드이다.
get 이외에도 app.post(),app.delete() 와 같이 http 메소드를 나타내는 다양한 메소드들이 사용가능하다.
텍스트 대신 json 파일 send하기.
예제에서 res.send()에 텍스트를 실어 나르게 되면, 많은 양의 텍스트를 전달하기에는 어려움이 있다.
예를 들어, "1", "2" 라는 텍스트를 보내고 싶은데,
app.get('/', function (req, res) {
res.send('1')
res.send('2')
})를 이용하게 되면 "1"값은 정상적으로 받아오지만, "2"값에서 오류가 발생한다.
이는 send 메소드에서 내부적으로 response.end()라는 메소드가 실행되기 때문에, 데이터를 더이상 전송할 수 없는 상태가 되기 때문이다.
따라서 우리는 텍스트 하나만을 보내는 것이 아니라, 많은 데이터를 담은 json을 전송하는 방법에 대해서 공부한다.
json이란?
JSON(제이슨, JavaScript Object Notation)은 속성-값 쌍(attribute–value pairs), 배열 자료형(array data types) 또는 기타 모든 시리얼화 가능한 값(serializable value) 또는 키-값 쌍으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다. 비동기 브라우저/서버 통신 (AJAX)을 위해, 넓게는 XML(AJAX가 사용)을 대체하는 주요 데이터 포맷이다. 특히 인터넷에서 자료를 주고 받을 때 그 자료를 표현하는 방법으로 알려져 있다. 자료의 종류에 큰 제한은 없으며, 특히 컴퓨터 프로그램의 변수값을 표현하는 데 적합하다.
[출처 : wikipedia]
쉽게 말해, 자바 스크립트의 객체가 어떻게 이루어져있는지에 대해 알려주는 파일이다.
예를 들어, .json 파일 안에는 다음과 같이 작성될 수 있다.
ex)
let book = {
title : "book's title",
author : "kim",
price : 20000
}json 형식을 send() 메소드에 사용하기 위한 몇가지 방법들이 있다.
1. 하나의 js파일에 객체를 생성하여 send 하기.
//express.js
const express = require('express') // 외부 모듈 불러오기
const app = express()
let book = {
title : "book's title",
author : "kim",
price : 20000
}
app.get('/', function (req, res) {
res.send(book)
})
app.listen(3000)2. 외부 json파일에 객체를 생성한 뒤, json파일을 require하여 send하기
// book.json
let book = {
title : "book's title",
author : "kim",
price : 20000
}
// express.js
const express = require('express')
const app = express()
const book = require('./book.json')
app.get('/', function (req, res) {
res.send(book)
})
app.listen(3000)3. res.send() 대신 res.json() 사용하기.
// book.json
let book = {
title : "book's title",
author : "kim",
price : 20000
}
// express.js
const express = require('express')
const app = express()
const book = require('./book.json')
app.get('/', function (req, res) {
res.json(book) // json으로 변경
})
app.listen(3000)동적 페이지 생성
우리가 만약 /products/1,/products/2,/products/3... 처럼
다양한 페이지를 생성하고 싶을 땐 어떻게 할까?
물론 다음과 작성할 수도 있긴 하다.
app.get('/products/1' , function(req, res) {
res.json({
num : 1
})
})
app.get('/products/2' , function(req, res) {
res.json({
num : 2
})
})
app.get('/products/3' , function(req, res) {
res.json({
num : 3
})
})하지만, 언제까지나 해당 숫자에 대한 작업을 일일히 지정해 줄 순 없다.
이때 사용하는 것이, 콜론(:)과 req.params이다.
예시를 보자.
app.get('/products/:n' , function(req, res) {
console.log(req.params)
console.log(req.params.n)
})이렇게 작성한 뒤, 해당 URL에 접속하여 확인해보면, 웹페이지에는 계속 로딩이 걸린다.
이는 .send()나 .json() 등의 respond.end() 명령이 없기 때문에, 계속 대기하고 있는 상태인 것이다.
이 상태에서, 콘솔을 확인해보면 req.params가 다음의 값을 출력한다.
{ n: '5'}
5이렇게 슬래시(/) 뒤에 콜론(:)과 변수명을 적음으로써,
req.params는 해당 변수명의 key와 value를 갖게 됨을 확인할 수 있다.
물론 n의 값을 이용하려면 다음 처럼 작성할 수 있다.
app.get('/products/:n' , function(req, res) {
res.json({
num : req.params.n
})
})