[session 로그인] 😭 세션 연장이 안 되는 문제

sookyoung.k·2024년 2월 6일

🍏 NodeJS

목록 보기

5/10

로그인 관련해서... 차곡차곡 글을 쌓아 모으려고 했는데 일단 최근에 발생한 이슈 해결을 먼저 적으려고 한다. 지독했다 세션...

🌀 세션 연장 코드

    // 쿠키의 maxAge를 originalMaxAge로 바꾼다
    req.session.resetMaxAge();

	// 응답에 쿠키 만료 시간을 함께 보내준다 
    res.json({
        success: true,
        message: '세션 만료 시간 연장 성공!',
        expiredTime: req.session.cookie.expires.getTime(),
      });

⚠️ 문제 상황 발생

무슨 문제냐하면! 서버에서는 세션 쿠키의 만료 시간이 연장이 되는데, 실제로는 연장 전의 만료 시간에 세션이 사라져버려서 401에러가 발생하는 문제이다.

나는 콘솔에 찍힌 것만 확인을 했기 때문에 문제 상황을 알지 못했다. 서버에서는 확인이 잘 되었음... 생명과도 같은 콘솔에는 분명 이상이 없이 시간 연장이 잘 되는데 문제를 발견을 못하겠으니까 이거로 하루이틀은 잡아먹은듯...

참고로 테스트 할 때 그냥 쿠키 만료 시간 5분 정도로 바꿔서 해도 됐을텐데 걍 60분씩 기다려가면서 했음. 과거의 나 왜그랬지?... 머쓱...

10시 9분 최초 로그인

최초 로그인 시 쿠키 값
expires: 2024-02-06T02:09:17.750Z
__lastAccess: 1707181757751

➡️ 최초 로그인 세션 만료 시간 11시 9분

세션 연장

확인 로그
cookie의 maxAge: 2248707 → maxAge: 360000 🪄 연장 완료
cookie의 expires: 2024-02-06T02:19:17.650Z → expires: 2024-02-06T01:31:49.047Z 🪄 만료 시간 연장 완료

➡️ 연장된 로그인 세션 만료 시간 11시 19분

쿠키 재확인
expires: 2024-02-06T02:31:49.048Z
__lastAccess: 1707181757751 → __lastAccess: 1707183109049

봐봐요... 여긴 멀쩡하다니깐요 콘솔에 찍힌 내용들을 보면 전혀 문제가 없다 ㅠㅠ

11시 9분 이후 글 쓰기
(최초 세션 만료 시간 이후)

와 진짜 안된ㄷ... 401 에러

쿠키 확인

그런데...? 그래서 쿠키를 확인해봐도 연장된 시간으로 그대로 있다...? 이 때부터 멘붕 징조가 왔음

🧐 원인 탐색...

문제 원인: maxAge가 리셋이 되어도 expires에 영향을 주지 못하는 것일까?

🪄 재시도

세션의 resetMaxAge()함수를 사용하여 maxAge를 리셋한 후 세션의 만료 시간을 가져와서 .setHeaher로 쿠키 값을 세팅해주기

	// 쿠키의 maxAge를 originalMaxAge로 바꾼다
    req.session.resetMaxAge();

    // 세션의 만료 시간을 가져온다
    const sessionExpires = req.session.cookie.expires;

    // 쿠키의 expires 속성을 세션의 만료 시간으로 설정
    res
      .setHeader('Set-Cookie', `expires=${sessionExpires.toUTCString()}`)
      .json({
        success: true,
        message: SUCCESS_MESSAGE.SESSION_EXTENDS,
        expiredTime: req.session.cookie.expires.getTime(),
      });

11시 41분 최초 로그인

최초 로그인 시 쿠키 값
expires: 2024-02-06T03:41:22.612Z
__lastAccess: 1707187282612

➡️ 최초 로그인 세션 만료 시간 12시 41분

세션 연장

확인 로그
cookie의 maxAge: 360000 🪄 연장 완료
cookie의 expires: 2024-02-06T03:41:22.612Z → expires: 2024-02-06T03:45:37.131Z 🪄 만료 시간 연장 완료

쿠키 재확인
expires: 2024-02-06T03:45:37.133Z
__lastAccess: 1707187537135

➡️ 연장 세션 만료 시간 12시 45분

12시 42분 글 작성 테스트
401 되어버렸죠...

🪄 재시도 2트

session의 resetMaxAge() 함수를 사용하는 것이 아니라 아예 재설정을 해주는 방향으로 갔다. (함수의 문제일까 생각해봄)

    // 세션 만료 시간 재설정
    req.session.cookie.maxAge = 3600000;
    res
      .setHeader('Set-Cookie', 'Max-Age=3600000')
      .json({
        success: true,
        message: SUCCESS_MESSAGE.SESSION_EXTENDS,
        expiredTime: req.session.cookie.expires.getTime(),
      });

이렇게 재시도를 해봅니다!

최초 로그인
오후 12시 52분

최초 로그인 시 쿠키 값
expires: 2024-02-06T04:52:28.976Z
__lastAccess: 1707191548977

➡️ 최초 로그인 세션 만료 시간 1시 52분

세션 연장

확인 로그
cookie의 maxAge: 360000 🪄 연장 완료
cookie의 expires: 2024-02-06T04:52:28.976Z → expires: 2024-02-06T03:55:03.674Z 🪄 만료 시간 연장 완료

쿠키 재확인
expires: 2024-02-06T04:55:03.675Z
__lastAccess: 1707191703676

➡️ 연장 세션 만료 시간 1시 55분

1시 53분 또 실패임... 또 실패야... 왜?...

🪄 3트...

이 코드에서 req.session.resetMaxAge()는 쿠키의 maxAge를 originalMaxAge로 변경하려는 시도가 있습니다. 그러나 이 메소드는 세션 쿠키의 maxAge를 재설정하는 것이 아닌, 세션의 maxAge를 초기화합니다. 따라서 이 메소드는 원하는 작업을 수행하지 않을 것입니다.

또한 res.setHeader('Set-Cookie', 'Max-Age=3600000')는 쿠키의 maxAge를 설정하려는 시도가 있지만, 이것은 새로운 쿠키를 생성하는 것이며, 기존의 세션 쿠키의 만료시간을 연장하는 것이 아닙니다.

이를 해결하기 위해, 쿠키의 만료 시간을 연장하려면 express-session의 cookie.maxAge 옵션을 사용해야 합니다. 그리고 이 옵션을 변경하면 express-session 미들웨어가 자동으로 Set-Cookie 헤더를 설정하여 클라이언트에게 전송합니다. 따라서 res.setHeader('Set-Cookie', 'Max-Age=3600000') 코드는 필요 없습니다.

답답한 마음에 뤼튼에 물어보니 이런 답을 얻었다...

세션 쿠키와 세션은 다르다구...?! 세션에도 maxAge가 있고 세션 쿠키에도 maxAge가 있는데 나는 세션만 건들기 때문에 쿠키에 영향을 주지 않는다는 말인가...?!

이게 먼소리야... 하고 다시 물어봤다. 같은 거 아니야?!

죄송합니다, 제가 설명이 혼동스러웠던 것 같습니다. 세션 쿠키와 서버 세션의 maxAge 설정은 사실상 동일한 작업을 수행합니다. 둘 다 세션의 유효 기간을 설정하는 것입니다.

세션 쿠키의 maxAge는 쿠키가 클라이언트(브라우저)에게 전송될 때, 그 쿠키가 얼마나 오래 유지될지를 결정합니다. 이렇게 설정된 maxAge는 클라이언트가 쿠키를 저장하고 관리하는 방식에 영향을 줍니다.

반면에, 서버 세션의 maxAge는 서버에서 세션 데이터를 얼마나 오래 유지할지를 결정합니다. 이는 서버가 세션 데이터를 언제 삭제할지를 결정하는데 사용됩니다.

따라서 req.session.cookie.maxAge = 3600000; 이 코드는 사실상 세션 쿠키의 maxAge를 서버 측에서 재설정하는 것이며, 이는 동시에 서버 세션의 유효 기간을 재설정하는 것입니다. 이렇게 함으로써 클라이언트와 서버 모두에서 세션이 얼마나 오래 유지될지를 동일하게 설정할 수 있습니다.

다시 한번, 제 설명이 혼란스러웠다면 사과드립니다. 이에 대한 귀하의 질문에 대해 좀 더 명확하게 답변하자면, 세션 쿠키의 maxAge와 서버 세션의 maxAge를 재설정하는 것은 실질적으로 같은 작업을 수행하며, 이 둘은 세션의 유효 기간을 동일하게 유지하기 위해 함께 재설정되어야 합니다.

이러니까 다시 혼란에 빠질 수밖에...

하지만 그래도 다른 문제점도 발견. 내가 res.setHeader로 Set-Cookie를 해준 값은 내 의도대로 로그인한 사용자의 쿠키 만료시간을 변경하는 것이 아닌, 그냥 Set-Cookie한 쿠키가 새롭게 생기는 것이었다. 때문에 setHeader는 해결책이 될 수 없다.

express-session을 사용하고 있기 때문에 이 미들웨어가 Set-Cookie를 자동으로 해준다는 점을 알고 있었는데도 그 점을 캐치하지 못했다. 사실 알았지만... 혹시라도... 지푸라기라도 잡는 심정으로 했던 건데 어림없죠 ㅠ 하아아~~

	// 쿠키의 maxAge를 originalMaxAge로 바꾼다
    req.session.cookie.maxAge = 3600000;
    res
      .json({
        success: true,
        message: SUCCESS_MESSAGE.SESSION_EXTENDS,
        expiredTime: req.session.cookie.expires.getTime(),
      });