개발자

Next.js API 에서 쿠키를 접근할수 있는 방법이 궁금합니

2023년 05월 31일조회 638

안녕하세요 nexst.js 쓰고 있는 주니어 프런트엔드 개발자입니다 DB API에 접근하기 위해 next에서도 API를 구성했는데 쿠키에 저장되있는 토큰값을 가져오질 못하고 있네요 방법 알려주시면 감사하겠습니다 아래 파일은 src/pages/api 에 존재합니다 const getOrder = async (token, order_no) => { return await fetch(`${process.env.NEXT_PUBLIC_API_HOST}/front/order/${order_no}`, { headers: { Authorization: `Bearer ${token}`, Accept: "application/json" } }).then(res => res.json()).then(data => data) } export default async function handler(req, res) { const { order_no } = req.query const token = "쿠키에 어떻게 접근해야 하나요???" const order = await getOrder(token, order_no) try { res.status(200).json({ ...order }) } catch (err) { res.status(200).json({ err }) } }

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 2

엄홍재님의 프로필 사진

안녕하세요 next.js api 에서 쿠키 사용하는 방법이 있습니다. 아마 req안에 들어있을 것 같아요 req.cookies에 쿠키에 대한 정보들이 들어 있을 겁니다. NextApiRequest type을 좀 상세하게 살펴보면 해당 키값으로 가져올 수 있는 것 같습니다. const token = req.cookies['쿠키 key 이름'] 이렇게 사용할 것 같네요. NextApiRequest의 타입 정보도 추가로 첨부해 놓겠습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
export interface NextApiRequest extends IncomingMessage {
    /**
     * Object of `query` values from url
     */
    query: Partial<{
        [key: string]: string | string[];
    }>;
    /**
     * Object of `cookies` from header
     */
    cookies: Partial<{
        [key: string]: string;
    }>;
    body: any;
    env: Env;
    preview?: boolean;
    /**
     * Preview data set on the request, if any
     * */
    previewData?: PreviewData;
}
profile picture

익명

작성자

2023년 05월 31일

친절한 답변 감사합니다!! 지금 사정상 타입스크립트를 쓰지 않고 자바스크립트로 Next.js를 구현하고 있는데요 이게 타입문제 때문에 그런건지? request에 cookie가 없습니다 혹시 이것도 왜그런지 아실런지요?

권혁진님의 프로필 사진

req 안에 들어있습니다. req.cookies에 없으시다면 console.log(req)로 출력하셔서 전체적으로 한번 살펴보시기 바랍니다.

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!