codestates / codestates/Touch

[Error handling] 카카오 소셜로그인 관련 토큰으로 유저정보 요청 시 cors 에러

Open
#45 0 comments 0 reactions 0 assignees View on GitHub
Complete error
Dominant language
JavaScript
Stars
0
Forks
1
PR merge metrics
No merged PRs in 30d

Description

> ### 어떤 에러인가요?
> 서버에서 전달받은 토큰으로 클라이언트에서 유저정보를 받아오기 위해 카카오로 요청을 보낼 때 cors 관련 에러를 확인할 수 있었습니다.
>
> ### 에러 메시지
> ```shell
> $ no 'access-control-allow-origin' header is present on the requested resource.
> ```
>
> ### 에러 핸들링 방법
> 검색해보니 kapi 요청같은 경우 cors 설정이 닫혀있어 클라이언트쪽에서 요청을 보내면 차단이 되고, 서버쪽에서 요청을 보내야 한다고 합니다. 서버에서 유저정보 요청을 보냈더니 정상적으로 잘 받아왔습니다.
>
> ```js
> axios.get(
> 'https://kapi.kakao.com/v2/user/me',
> {
> headers: {
> Authorization: `Bearer ${accessToken}`
> }
> },
> { withCredentials: true })
> .then((data) => {
> console.log(data.data)
> })
> ```
>
> 위 코드에서의 문제는 따로 없었으나 클라이언트에서 요청을 보낼 시 유저정보를 받아올 수 없었고, 서버쪽에서 요청을 보내야지만 정상적으로 유저정보를 받아올 수 있습니다.
>
> ### 에러 핸들링을 위해 참고한 레퍼런스 링크
> [링크](https://kakao-tam.tistory.com/81)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.