4-2. 쿠키 설정하기

이제, 로그인 / 회원가입을 하고 나서 토큰을 httpOnly 속성을 적용하여 쿠키를 설정하는 방법을 알아보겠습니다. 쿠키를 설정 할 때는 다음과 같은 방식으로 합니다.

ctx.cookies.set('name', 'value', { httpOnly: true, maxAge: 1000 * 60 * 60 * 24 * 7 });

그럼 이제, auth 컨트롤러 파일을 수정해보겠습니다.

회원가입을 하고 나서, 토큰을 발급한 다음에, 쿠키로 설정하는 코드를 다음과 같이 입력하세요.

`src/api/auth/auth.controller.js` - localRegister

// 로컬 회원가입
exports.localRegister = async (ctx) => {
    (...)

    // 계정 생성
    let account = null;
    try {
        account = await Account.localRegister(ctx.request.body);
    } catch (e) {
        ctx.throw(500, e);
    }

    let token = null;
    try {
        token = await account.generateToken();
    } catch (e) {
        ctx.throw(500, e);
    }

    ctx.cookies.set('access_token', token, { httpOnly: true, maxAge: 1000 * 60 * 60 * 24 * 7 });
    ctx.body = account.profile; // 프로필 정보로 응답합니다.
};

코드를 저장하고나서, 회원가입을 다시한번 해보세요. 회원가입에 성공하면, 아래 스크린샷처럼 하단에 Cookies 탭을 클릭하면 생성된 토큰이 조회됩니다.

이렇게 만들어진 쿠키는 Postman 에서 다음 요청을 할때도 유지됩니다. 이 쿠키를 초기화시키려면 요청부분 Save 버튼 하단의 주황색 Cookies 텍스트를 누르셔서 쿠키창을 열어 쿠키를 지우면 됩니다.

이제, 로그인도 마찬가지로 설정하도록 하겠습니다.

`src/api/auth/auth.controller.js` - localLogin

exports.localLogin = async (ctx) => {
    (...)

    if(!account || !account.validatePassword(password)) {
    // 유저가 존재하지 않거나 || 비밀번호가 일치하지 않으면
        ctx.status = 403;
        return;
    }

    let token = null;
    try {
        token = await account.generateToken();
    } catch (e) {
        ctx.throw(500, e);
    }

    ctx.cookies.set('access_token', token, { httpOnly: true, maxAge: 1000 * 60 * 60 * 24 * 7 });
    ctx.body = account.profile; // 프로필 정보로 응답합니다.
};

코드를 입력하고나서, 이제 로그인을 시도하고, 쿠키가 설정되는지 확인을 해보세요.

로그아웃 구현하기

그 다음엔, 로그아웃 API 를 구현해보겠습니다. 이 부분에서는, 쿠키의 access_token 값을 null 로 설정하면 됩니다.

`src/api/auth/auth.controller.js` - logout

exports.logout = (ctx) => {
    ctx.cookies.set('access_token', null, {
        maxAge: 0, 
        httpOnly: true
    });
    ctx.status = 204;
};

4-2. 쿠키 설정하기