인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

joka님의 프로필 이미지
joka

작성한 질문수

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

23-01-login / login-success

accessToken을 createUploadLink에 넣어주는 이유?

작성

·

183

·

수정됨

0

ex) src/components/commons/apollo/index.tsx

// ...
  const uploadLink = createUploadLink({
    uri: "...",
    headers: { Authorization: `Bearer ${accessToken}` },
  });

  const client = new ApolloClient({
    link: ApolloLink.from([uploadLink]),
    cache: GLOBAL_STATE,
  });
// ...

이전 강의에서 createUploadLink 함수를 이미지같은 파일을 업로드 설정을 위해 불러왔었는데 이 안에 accessToken을 넣어주는 게 이해가 가지 않았습니다. 지금 제 머릿속에는 자동으로 headers에 accessToken을 담아서 인가를 해주는 설정을 왜 이미지업로드를 위한 설정함수에 accessToken을 넣어주는 거지?라는 생각이 들어서 혼란스럽습니다.. 이 부분에 대해서 제가 잘못 이해하고 있거나 이렇게 해주는 이유에 대해서 알려주신다면 감사드리겠습니다!

답변 1

0

안녕하세요, 인프런 AI 인턴입니다.

joka님, 문의하신 내용에 대한 답변을 드리겠습니다.

createUploadLink 함수에 accessToken을 전달하는 이유는 인증을 확보한 상태에서 파일 업로드가 이루어지도록 하기 위함입니다. 일반적으로 서버에서는 민감한 작업을 수행할 때 사용자의 인증 정보, 즉 accessToken을 요구합니다. 이미지나 파일을 업로드하는 경우도 사용자가 권한이 있는지 검증을 하기 위해 토큰을 검사합니다.

해당 accessToken을 HTTP 헤더에 포함시켜 보내면, 서버는 이 헤더를 확인하여 요청이 유효한 사용자로부터 왔는지를 검증할 수 있습니다. 이러한 과정을 통해 서버는 무단 업로드 및 보안 문제를 예방하고, 권한이 있는 사용자만이 파일 업로드를 할 수 있게 하기 위해 accessToken을 사용합니다.

다시 말해, 이미지 업로드가 인증된 사용자에 의해서만 수행되어야 한다면, 해당 작업을 요청하는 클라이언트는 서버에게 자신이 유효한 사용자임을 증명하는 accessToken을 함께 제공해야 합니다. 그렇기 때문에 createUploadLink 함수에서 uploadLink를 생성할 때 accessToken을 headers에 포함하는 것입니다.

혼란스러우셨던 부분이 잘 해소되셨길 바랍니다. 추가적인 질문이 있으시다면 언제든지 문의해 주세요.

joka님의 프로필 이미지
joka

작성한 질문수

질문하기