Recent Posts
Recent Comments
Archives
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- 코딩테스트
- js
- 모던 자바스크립트
- CORS
- 초기셋팅
- 티스토리챌린지
- error
- deep dive
- 소셜 로그인
- 코테
- git
- 스파르타코딩클럽
- nextjs
- Next
- 오블완
- vscode
- 프로젝트 셋팅
- 리터럴
- domain
- 모던자바스크립트
- 자주 까먹는
- 내일배움캠프
- 프로그래머스
- vercel
- 코드카타
- React
- 셋팅
- 구글 로그인
- useRouter
- array정적메서드
- Today
- Total
파피루스
[next/react] google 로그인 구현하기 (3) : 로그인 구현하기 본문
이전 글: https://reeny404.tistory.com/120
이전에 액세스 토큰까지 무사히 잘 받아왔다면, 이제 받은 토큰을 이용해서 google 로그인 정보를 가져오자!
로그인 정보?
: 내가 개발하는 사이트에 저장할 email이나 nickname 정보를 말한다.
구현중인 서비스의 소셜 회원가입/로그인 정책 상 필요한 데이터들
0. people API 사용 on
https://console.cloud.google.com/home/dashboard 에 가서 people API 검색한 후, 사용 on하기
1. 프로필 가져오기
official docs
https://developers.google.com/people/v1/profiles
https://developers.google.com/people/api/rest/v1/people/get
GET /v1/people/me?personFields=names,emailAddresses HTTP/1.1
Host: people.googleapis.com
❗) personFields와 같은 queryString은 문서의 personFields을 참고할 것!
내 경우에는 emailAddresses, nicknames, names, metadata, photos, coverPhotos 로 테스트 해보고, 최종적으로는 밑줄친 항목만 저장하기로 결정했다.
응답 데이터 구조
{
"resourceName": "people/0123456789000000",
"etag": "문자열",
"nicknames": [
{
"metadata": {
"primary": true,
"source": {
"type": "PROFILE",
"id": "0123456789000000"
}
},
"value": "떼굴펜",
"type": "ALTERNATE_NAME"
}
],
"photos": [
{
"metadata": {
"primary": true,
"source": {
"type": "PROFILE",
"id": "0123456789000000"
}
},
"url": "https://lh3.googleusercontent.com/a/ACg8ocJ1F34eOpuxNiBrKARkyQSyOMnMQOubpZiJbB8wzpyL15FeFMA=s100"
}
],
"emailAddresses": [
{
"metadata": {
"primary": true,
"verified": true,
"source": {
"type": "ACCOUNT",
"id": "0123456789000000"
},
"sourcePrimary": true
},
"value": "aaa@aaa.aa"
}
]
}
'Today I Learned > in dev' 카테고리의 다른 글
vscode 설정 초기화 방법 & re-setting (0) | 2024.10.05 |
---|---|
google api, 403 permission_denied (0) | 2024.10.03 |
[next/react] 로티(lottie) 적용하기 (1) | 2024.09.06 |
[google oauth] localhost 에서 400 오류 : redirect_uri_mismatch 오류 해결 (0) | 2024.09.04 |
[next/react] google 로그인 구현하기 (2) : 액세스 토큰 받기 (0) | 2024.09.04 |