쉽게 nodejs 서버 만들기 (10): POST 요청 처리_node.js

지금까지 우리가 구축한 서버는 실용적인 용도가 없습니다. 다음으로 실제로 유용한 기능을 구현해 보겠습니다.

우리가 원하는 것은 사용자가 파일을 선택하고 파일을 업로드한 다음 브라우저에서 업로드된 파일을 보는 것입니다.

먼저 사용자가 콘텐츠를 입력하고 POST 요청을 통해 서버에 제출할 수 있는 텍스트 영역이 필요합니다.

시작 이벤트 핸들러에 코드를 추가하고 다음과 같이 requestHandlers.js를 수정합니다.

코드 복사 코드는 다음과 같습니다.

함수 시작(응답) {
console.log("요청 핸들러 'start'가 호출되었습니다.");
var body = ''
''
'' '' '

' '' '' ''
''
'';
response.writeHead(200, {"Content-Type": "text/html"});
response.write(본문);
response.end();
}
함수 업로드(응답) {
console.log("요청 핸들러 '업로드'가 호출되었습니다.");
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("안녕하세요 업로드");
response.end();
}
수출.시작 = 시작;
수출.업로드 = 업로드;



브라우저에서 http://localhost:8888/start를 방문하면 효과를 확인할 수 있습니다.

다음으로 사용자가 양식을 제출할 때 POST 요청을 트리거하는 /upload 요청 핸들러를 구현해야 합니다.

전체 프로세스를 비차단으로 만들기 위해 Node.js는 POST 데이터를 여러 개의 작은 데이터 청크로 분할한 다음 특정 이벤트를 트리거하여 이러한 작은 데이터 청크를 콜백 함수에 전달합니다. 여기서 특정 이벤트에는 데이터 이벤트(새로운 작은 데이터 블록이 도착했음을 나타냄)와 종료 이벤트(모든 데이터가 수신되었음을 나타냄)가 포함됩니다.

요청 객체에 리스너를 등록하여 이를 수행합니다. 여기의 요청 객체는 HTTP 요청이 수신될 때마다 onRequest 콜백 함수에 전달됩니다.

서버에 코드를 넣고, server.js를 다음과 같이 수정합니다.

코드 복사

코드는 다음과 같습니다. var http = require("http"); var url = require("url"); 함수 시작(경로, 핸들) {

함수 onRequest(요청, 응답) {

var postData = "";
var 경로명 = url.parse(request.url).pathname;
console.log("" pathname "에 대한 요청이 수신되었습니다.");
request.setEncoding("utf8");
request.addListener("data", function(postDataChunk) {
PostData = postDataChunk;
console.log("POST 데이터 청크를 받았습니다. '" postDataChunk "'.");
});
request.addListener("end", function() {
경로(핸들, 경로명, 응답, postData);
});
}
http.createServer(onRequest).listen(8888);
console.log("서버가 시작되었습니다.");
}
수출.시작 = 시작;



위 코드는 세 가지 작업을 수행합니다. 먼저 수신된 데이터의 인코딩 형식을 UTF-8로 설정한 다음 "data" 이벤트에 대한 리스너를 등록하여 수신된 각각의 새 데이터 블록을 수집하고 이를 postData 변수. 마지막으로 요청 라우팅 호출을 end 이벤트 핸들러로 이동하여 모든 데이터가 수신되었을 때만 한 번만 실행되도록 합니다. 또한 POST 데이터를 요청 라우터에 전달합니다. 이 데이터는 요청 핸들러에서 사용되기 때문입니다.

다음 /upload 페이지에는 사용자가 입력한 내용이 표시됩니다

router.js를 변경해 보겠습니다.

코드 복사

코드는 다음과 같습니다.

함수 경로(핸들, 경로명, 응답, postData) {
console.log("pathname에 대한 요청을 라우팅하려고 합니다.");
if (typeof 핸들[경로 이름] === '함수') {
핸들[경로명](응답, postData);
} 그 밖의 {
console.log("경로명에 대한 요청 핸들러를 찾을 수 없습니다.");
response.writeHead(404, {"Content-Type": "text/plain"});
response.write("404 찾을 수 없음");
response.end();
}
}
수출.경로 = 경로;

그런 다음 requestHandlers.js에서 업로드 요청에 대한 응답에 데이터를 포함합니다.

코드 복사 코드는 다음과 같습니다.

함수 시작(응답, postData) {
console.log("요청 핸들러 'start'가 호출되었습니다.");
var body = ''
'<머리>' ''
'' '' '' '' '' ''
''
'';
response.writeHead(200, {"Content-Type": "text/html"});
response.write(본문);
response.end();
}
함수 업로드(응답, postData) {
console.log("요청 핸들러 '업로드'가 호출되었습니다.");
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("보낸 내용: " postData);
response.end();
}
수출.시작 = 시작;
수출.업로드 = 업로드;



마지막으로 해야 할 일은 현재 요청의 전체 메시지 본문을 요청 경로와 요청 핸들러에 전달하는 것입니다. 관심 있는 POST 데이터 부분만 요청 경로와 요청 핸들러에 전달해야 합니다. 이 예에서는 실제로 텍스트 필드에만 관심이 있습니다.

이전에 소개한 쿼리스트링 모듈을 사용할 수 있습니다:

코드 복사

코드는 다음과 같습니다. var querystring = require("querystring"); 함수 시작(응답, postData) { console.log("요청 핸들러 'start'가 호출되었습니다."); var body = ''

'<머리>' ' 'charset=UTF-8" />'
'' '' '' '' '' ''
''
'';
response.writeHead(200, {"Content-Type": "text/html"});
response.write(본문);
response.end();
}
함수 업로드(응답, postData) {
console.log("요청 핸들러 '업로드'가 호출되었습니다.");
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("다음 텍스트를 보냈습니다: " querystring.parse(postData).text);
response.end();
}
수출.시작 = 시작;
수출.업로드 = 업로드;



자, 이것이 POST 데이터 처리에 관한 것입니다.

다음 섹션에서는 이미지 업로드 기능을 구현하겠습니다.