Node.js 에러 해결: Cannot set headers after they are sent to the client

Node.js 에러: “Cannot set headers after they are sent to the client”

Node.js를 사용하여 Express 애플리케이션을 개발할 때 종종 마주칠 수 있는 에러 중 하나는 Cannot set headers after they are sent to the client입니다. 이 에러는 주로 하나의 요청에 대해 두 번 이상 응답을 시도했을 때 발생합니다. 이번 포스트에서는 이 에러가 왜 발생하는지와 이를 방지하는 방법을 살펴보겠습니다.

에러 상황 설명

아래는 이 에러가 발생할 수 있는 예제 코드입니다:

router.get('/new', (req, res) => {
    if (!req.isAuthenticated()) {
        req.flash('error', 'you must be signed in');
        return res.redirect('/login'); // 응답 종료
    }
    res.render('campgrounds/new'); // 새 페이지 렌더링
});

이 코드는 사용자가 인증되지 않은 상태에서 /new 경로에 접근하려고 하면 로그인 페이지로 리다이렉트 시키는 로직을 포함하고 있습니다.

하지만 if 문 안에 있는 return을 제거하면 다음과 같은 에러가 발생할 수 있습니다:

Error: Cannot set headers after they are sent to the client

왜 에러가 발생할까?

이 문제는 res.redirect('/login')과 res.render('campgrounds/new')가 동시에 실행될 때 발생합니다. 각 응답 메서드는 클라이언트에게 응답을 전송하고, 이 과정에서 HTTP 응답 헤더를 설정합니다.

HTTP 프로토콜에서는 응답 헤더를 한 번만 설정할 수 있습니다. 따라서 첫 번째 응답(res.redirect)이 전송된 후, 두 번째 응답(res.render)이 실행되면 이미 전송된 헤더를 다시 설정하려고 시도하기 때문에 에러가 발생합니다.

해결 방법: return 사용하기

return 키워드를 사용하여 첫 번째 응답 이후 함수 실행을 종료하면 문제를 해결할 수 있습니다. 수정된 코드는 다음과 같습니다:

router.get('/new', (req, res) => {
    if (!req.isAuthenticated()) {
        req.flash('error', 'you must be signed in');
        return res.redirect('/login'); // 응답 종료
    }
    res.render('campgrounds/new'); // 새 페이지 렌더링
});

위 코드에서 return은 if 조건이 참일 때 함수 실행을 즉시 종료하여 res.render가 실행되지 않도록 보장합니다. 이로 인해 에러를 방지할 수 있습니다.

추가 팁: 에러 디버깅 방법

• 응답 메서드 확인: res.send, res.redirect, res.render 등 응답 메서드가 어디에서 호출되는지 확인하세요.
• 중복 응답 방지: 각 요청에 대해 하나의 응답만 전송되도록 보장하세요.
• 로깅: 디버깅을 위해 조건문 안에서 로그를 출력해 흐름을 추적하세요.

router.get('/new', (req, res) => {
    if (!req.isAuthenticated()) {
        console.log('User not authenticated, redirecting to login.');
        req.flash('error', 'you must be signed in');
        return res.redirect('/login');
    }
    console.log('User authenticated, rendering new page.');
    res.render('campgrounds/new');
});

요약

• Cannot set headers after they are sent to the client 에러는 한 요청에 대해 두 번 이상 응답을 시도할 때 발생합니다.
• 응답 이후 코드 실행을 중단하기 위해 return 키워드를 사용하세요.
• 각 요청에 대해 하나의 응답만 전송되도록 주의하세요.

이 글이 에러 해결에 도움이 되길 바랍니다. Happy Coding! 🎉