서버에서 혹은 클라이언트에서 발생할 수 있는 예외적인 상황을 파악하고 처리하는 것이 쉽지 않다. 클라이언트의 입력을 항상 믿을 수 있는지? 이상적인 상황으로만 흘러가게 둘 수 있는지?

다양한 케이스를 생각하고 대응하기가 어려운 것 같다. 에러를 처리하는 방법에 대해서 고민이 많은데, 이번에 한번 정리해보자.

클라이언트의 에러처리

try … catch …finally문

try {
	// 실행 코드(에러가 발생할 가능성이 있는 코드)
} catch (err) {
	// try 코드 블록에서 에러가 발생하면 이 코드 블록의 코드가 실행된다.
	// err에는 try 코드 블록에서 발생한 Error 객체가 전달된다.
} finally {
	// 에러 발생과 상관 없이 반드시 한 번 실행된다.
}

• 가장 자주 쓰는 에러 처리 방법이다.
• 코드 블록을 실행하고, 실행 중의 에러를 캐치할 수 있다. 스크립트는 죽지 않고 에러를 처리할 수 있다.
• 어떤 오류를 처리할 지 정확히 알고 있는 경우에 사용한다.

catch문에서는 Error 객체 정보에 대한 내용을 활용해주는 게 좋다.

Error 객체

Error 객체는 런타임 오류가 발생했을 때 던져진다. 사용자가 지정 할 수 있다.

• 프로퍼티
  • message: Error 생성자 함수에 인수로 전달한 에러 메시지
  • stack: 에러를 발생시킨 콜스택의 호출 정보
  • name: 오류 이름

또한 에러 객체를 상속해서 커스텀 에러를 만들 수 있다.

class MyCustomError extends Error {
	constructor(message) {
		super(message);
		this.name = 'MyCustomError';
	}
}

try {
	throw new MyCustomError('Something went wrong!');
} catch (error) {
	console.error(error.name + ': ' + error.message);
}

에러를 발생시키려면?

try 블록에서 throw 문을 통해 에러 객체를 던져야 한다.

try {
	throw new Error("something wrong");
} catch (error) {
	console.log(error);
}

• try문에서 던진 에러는 catch에서 잡아서 출력한다.

http 요청을 에러처리하기

클라이언트에서 http 요청을 에러처리 할 때, 위의 방법들을 사용할 수 있다.

export const http요청 = async ({ uri, method, body }) => {
  try {
	  const response = await fetch('https://api-주소')

    if (!response.ok) {
      throw new Error('something wrong')
    }
    return await response.json();
  } catch (error) {
    console.error(error);
  }
};

또한 catch문 안에서, error 객체의 status 코드 등을 사용해서 상태 코드마다 분기 처리를 할 수도 있다.

서버에서의 에러처리

서버에서는 각 상황에 맞게 클라이언트 측에 상태코드를 전달해야 한다.

express에서는 next()를 통해 미들웨어로 에러처리를 위임할 수 있다. 미들웨어에서 에러를 처리한다면 일관성있게 관리할 수 있다.

app.get('*', function(req, res, next) {
  const error = new Error('My Error occurred');
  error.status = 500;
  next(error); // 미들웨어로 에러 전달
});

app.use(errorHandler);

// 에러를 처리하는 미들웨어
function errorHandler(err, req, res, next) {
  res.status(err.status || 500);
  res.send(err.message || 'Error!!');
}

레퍼런스

Mastering Error Handling in JavaScript

express의 기본적인 에러 처리 방식