작성
·
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에 포함하는 것입니다.
혼란스러우셨던 부분이 잘 해소되셨길 바랍니다. 추가적인 질문이 있으시다면 언제든지 문의해 주세요.