본문 바로가기
멀티캠퍼스 풀스택 과정/백엔드

[Node.js] 4. 동기식과 비동기식으로 파일 읽기와 쓰기(with 이미지)

by 이쟝 2022. 3. 31.

동기(Synchronous) 비동기(Asynchronous)
일을 처리할 떄 순서대로 처리 일을 처리할 때 병렬적으로 동시에 처리
비동기적 처리와 비교할 때 효율이 떨어짐 동기적 처리와 비교할 때 효율이 높음
구현이 간단함 구현이 복잡함
요청을 보낸 후 해당 요청의 응답을 받아야 다음 동작을 실행 요청을 보낸 후 응답과 관계없이 다음 동작을 실행
동기적으로 사용하는 함수는  'Sync'가 붙어있다.  비동기적으로 사용하는 함수는  'Sync'가 붙어 있지 않다.

 

-> 동기적 함수 (readFileSync)와 비동기적 함수(readFile)은 동일한 기능을 수행한다.

 


1. 파일을 읽어서 동기식, 비동기식으로 처리해보기(서버객체 생성 xx)

1. 읽을 파일을 생성한다. (file_read.txt)

// file_read.txt
Node.js에서 파일의 내용을 동기식 또는 비동기식으로 읽기
테스트중입니다!

2. file_read.txt를 읽을 파일 생성(node08_file_read.js)

let fs = new require('fs'); // (1)

// (2)
console.log("__filename : " + __filename);
console.log("__dirname : " + __dirname);

(1) fs(file system) : 파일 읽기와 쓰기를 처리하는 모듈, 파일을 읽기 위해서 모듈을 객체생성한다.

(2) 파일을 읽거나 쓰기 위해서는 절대주소가 필요하다.

  • [1] __filename : 현재 실행되는 파일의 경로와 파일명을 절대주소로 가진다.
  • [2] __dirname :  (directory)현재 실행중인 파일의 경로를 절대주소로 가진다.

 

1. 비동기식으로 파일을 읽기

 읽기, 쓰기 명령이 바로 실행되지 않고 쓰레드로 처리된다.

let fs = new require('fs');

//(1)
fs.readFile(__dirname+"/file_read.txt",'utf-8',function(error, data){ //(2)
    
    // error에 내용이 있으면 true
    if(error){ // 파일읽기 실패
        console.log("파일읽기 실패"); 
    }else{ // 파일읽기 성공
        console.log("파일1: 비동기식 읽기------");
        console.log(data);
    }
});

(1) 비동기식으로 파일을 읽기 위해서 readFile( )메서드를 사용한다.

  • readFile(파일의 경로+파일명, 인코딩, 콜백함수(파일의 내용을 읽고 난 후 호출되는 함수))

(2) 콜백함수의 첫 번째 매개변수: 파일을 읽을 때 난 에러 / 두 번째 매개변수 : 파일의 내용(데이터)

 

[순서]

1) console.log("파일1: 비동기식 읽기-----")가 먼저 호출

2) file_read.txt의 내용(Node.js에서 ~ 테스트중입니다!)가 호출


2. 동기식으로 파일을 읽기

읽기 쓰기 명령을 만나면 바로 실행된다.

1. node_test.js 파일 생성 

// node_test.js 파일 테스트 중입니다.
let data = fs.readFileSync(__dirname+"/node_test.js","utf-8"); // (1)
console.log("파일2: 동기식 읽기-----" + data);

(1) 동기식으로 파일을 읽기 위해서 readFileSync( )메서드를 사용한다.

  • readFileSync(파일의 경로+파일명, 인코딩)

동기식 실행이 먼저되고 난 뒤 비동기식 실행!

 


2. 클라이언트에게 이미지를 보여주게 하기(비동기식으로 파일 읽기)

1. img 폴더를 생성 후 이미지 복사한 뒤 파일 생성(node09_img_response.js)

// node09_img_response.js
let http = new require('http'); // 서버를 사용하기 위해 객체 생성
let fs = new require('fs');  

let server = http.createServer(function(request,response){
});

server.listen(10006, function(){
	console.log("server start http://127.0.0.1:10006");
});

2. 이미지를 보여주게 한다.

let http = new require('http');
let fs = new require('fs'); 

let server = http.createServer(function(request, response){
	//(1) 
    fs.readFile(__dirname+'/img/ham.jpg', function(error, imgSrc){
    	if(!error){ // 에러가 아닐 때
            response.writeHead(200, {'Content-Type':'image/jpeg'}); //(2)
            response.end(imgSrc);
        }
    });
});

server.listen(10006, function(){
    console.log("server start http://127.0.0.1:10006");
});

(1) 이미지를 비동기식으로 읽기 위해 readFile( )메서드를 사용한다. 이미지기이기 때문에 인코딩 필요 xx

(2) 이미지를 표시할 때는 Content-Type에 맞는 이미지 종류를 적는다. 

 


3. 파일 쓰기(서버 객체 생성 xx)

1. 비동기식으로 파일 쓰기

let fs = new require('fs');

let writeData = '비동기식으로 파일 쓰기 연습 중입니다!\r\n★☆★'; // (1)

// (2)
fs.writeFile(__dirname+'/file_write.txt', wirteData, 'utf-8', function(error){
	
    if(error){
    	console.log('비동기식으로 파일쓰기 실패' + error);
    }else{
    	console.log('비동기식으로 파일쓰기 성공!');
    }
    
});

(1) \r\n 엔터

(2) 파일을 비동기식으로 쓰기 위해 writeFile( )메서드를 사용한다.

  • 매개변수: 파일경로+파일명, 파일에 쓸 내용, 인코딩, 콜백함수

 

자동으로 파일이 생성된다. (file_write.txt)

2. 동기식으로 파일 쓰기

let fs = new require('fs');

let writeDataSync = '동기식으로 파일 쓰기 연습 중입니다!\r\n★☆★';
try{ // (1)
    fs.writeFileSync(__dirname+"/file_write2.txt", writeDataSync, 'utf-8');
    console.log("동기식 쓰기 완료");
}catch(error){
    console.log("동기식으로 파일 쓰기 에러" + error);
}

(1) 파일을 동기식으로 쓰기 위해 writeFileSync( )메서드를 사용한다.

  • 매개변수: 파일경로+파일명, 파일에 쓸 내용, 인코딩, (콜백함수)

 

 

 

자동으로 파일이 생성된다. (file_write2.txt)

3. 동일한 파일에 데이터 추가하기

기존 파일에 이어쓰기 하고자 하면 appendFile(): 비동기식 / appendFileSync(): 동기식 메서드를 사용

let writeappendData = 'file_write에 추가할 데이터';
fs.appendFile(__dirname+'/file_write.txt', writeappendData, 'utf-8', function(err){
    if(err) throw err;
    console.log('file_write에 데이터가 추가되었습니다!');
});

(1) 기존 파일에 비동기식으로 데이터를 추가하기 위해  appendFile( )메서드를 사용한다.

기존에 있었던 file_write.txt에 데이터가 추가되었다.