반응형
GET, POST, 정적 / 동적 파일 제공
클라이언트 요청에 따라 다양하게 처리해보는 방법과 fs 모듈을 이용해 이미지, html 과 같은 파일을 전송하는 방법에 대해 알아보겠습니다.
사용자의 요청에 따라 처리할 때 다음의 두 가지가 가장 중요합니다.
- URL
- methods
URL 로 어떤 method 로 요청했는지만 파악하고 해당 요청에 맞추어 코드를 실행하여 응답하면 됩니다.
GET 요청 처리
요청 객체에서 method 가 GET 이 맞는지 검사 후 GET 요청을 처리할 수 있습니다.
요청 객체에서 확인한 URL 과 method 를 이용해 조건 분기를 해줍니다.
const http = require("http");
http.createServer((req, res) => {
let { url, headers, method } = req;
if (method === 'GET') {
console.log('GET Method')
if (url === "/users") {
res.writeHead(200);
res.end("/users 접속");
} else if (url === "/boards") {
res.end("/boards 접속");
} else if (url === "/clothes") {
res.end("/clothes 접속");
}
}
res.writeHead(404);
res.end('NOT FOUND PAGE ! ');
}).listen(3000, () => {
console.log('server on : 3000port');
})- method 가 GET(POST) 이 맞는지 검사한 후, GET(POST) 이 맞으면 URL 에 따라 분기를 하게 됩니다.
GET method 로 /boards 로 접속했을 때
POST method 로 접속했을 때
POST 요청 처리
GET 요청에서 처리하는 것과 크게 다른건 없지만, GET 을 제외한 method 는 body 데이터를 받을 수 있습니다.
const http = require("http");
http.createServer((req, res) => {
let { url, headers, method } = req;
let body = {};
req.on('data', (data) => {
data.toString().split('&').map(item => {
let s = item.split('=');
let key = s[0];
let value = s[1];
body[key] = value
})
}).on('end', () => {
for (let i = 0; i < 10; i++) {
console.log(i)
}
if (method === "POST") {
res.writeHead(200);
if (url === "/user") {
console.log("tt");
res.end("/user 정보 추가");
}
}
res.writeHead(404);
res.end("NOT FOUND PAGE!");
}).on('error', (err) => {
res.writeHead(500)
res.end('Server Error');
});
}).listen(3000, () => {
console.log('server on : 3000port')
})- 실행결과
파일 제공
서버는 이미지, HTML 등의 다양한 타입의 리소스를 제공할 수 있어야 합니다.
node.js 에서는 파일을 다루기 위해 fs (file system) 모듈을 제공합니다.
fs 는 readFile 을 이용해 파일을 읽을 수 있습니다.
첫 번째 인자로 읽을 파일을 전달하고 결과를 콜백함수로 전달하게 됩니다.
콜백함수는 첫 번째 인자로 에러를, 두 번째 인자로 결과를 줍니다.
readFile 로 파일을 읽으면 Buffer 형으로 데이터를 읽기 때문에 toString() 을 이용하여 일반적인 문자열로 바꿔줄 수 있습니다.
- test.txt
vue.js
nuxt.js
node.js
Javascript- test.html
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Test</title>
</head>
<body>
<h1>Lorem</h1>
</body>
</html>- fs.js
const fs = require('fs')
fs.readFile('./test.html', function (err, data) {
if (!err) {
console.log('test.html 파일 읽기 성공')
// console.log(data);
console.log(data.toString())
return
}
console.log(err)
})
fs.readFile('./test.txt', function (err, data) {
if (!err) {
console.log('text.txt 파일 읽기 성공')
// console.log(data)
console.log(data.toString())
return
}
console.log(err)
})- 실행 결과
참고도서 : 자바스크립트로 서버와 클라이언트 구축하기
반응형
'Study > Express(node.js)' 카테고리의 다른 글
| express ) express-generator 프로젝트 생성하기 (0) | 2022.02.05 |
|---|---|
| express ) 미들웨어 (0) | 2022.02.04 |
| express ) Router (0) | 2022.01.17 |
| node.js ) package.json 파헤치기 (0) | 2022.01.16 |
| Node.js ) 웹서버 기초 (1) - http 모듈, 요청 객체, 응답객체 (0) | 2022.01.15 |
댓글