희운의 일상 블로그

Front(SPA) 카카오 로그인 API 연동 하기(Angular) 카카오 로그인 API 연동 : 로그인 api 연동방식이 타 sns(소셜) api 에 비해 가장 심플하고 군더더기가 없어 로그인 연동 방식이 어렵지 않습니다. 상세한 부분은 아래에 카카오에서 제공하는 공식 문서를 확인 바랍니다. * api 문서 : https://developers.kakao.com/docs/latest/ko/kakaologin/rest-api import { Component, NgZone, OnInit, OnDestroy } from '@angular/core'; declare const Kakao: any; declare const $: any; export const kakao_key = { apiKey: '1d11..

Front(SPA) 구글 로그인 API 연동 하기(Angular) 구글 로그인 API 연동 : 기본 gapi auth2 방식의 로그인은 2023년 3월 31일 이후 지원이 중단되며, 새로운 클라이언트 아이디를 생성해서 작업하려면 반드시 아래의 gsi 로그인 방식을 이용해야 합니다. * api 문서 : https://developers.google.com/identity/gsi/web/guides/overview?hl=ko import { Component, NgZone, OnInit, OnDestroy } from '@angular/core'; declare const google: any; declare const $: any; export const google_key = { apiKey: 'Abcd..

Front(SPA) 네이버 로그인 API 연동 하기(Angular) SNS 로그인 api 연동은 보통 한번 작업해 놓으면 특별히 수정할일이 없는 부분이긴 한데 최근 4대 SNS 계정의 연동 방법이 조금 귀찮게 바뀌어서 다시 정리하는 차원에서 공유(공유이지만 사실상 기록) 합니다. 네이버 로그인 API 연동 : 네이버는 다른 소셜과 다르게 여전히 콜백처리를 특정 url 로 하게 합니다. 보통의 웹페이지 방식에서는 문제될게 없지만 front 즉 리액트,뷰,앵귤러,스벨트 등등 SPA 기반(싱글페이) 방식에서는 깔끔하지가 않습니다. 또한 로그인을 시도하는 클릭 버튼 조차 커스텀 하게 사용이 어렵습니다. 그래서 제가 사용하는 방법은 새창으로 뜬 로그인 페이지에서 곧바로 콜백이 일어 나기 때문에 부모페이지에서 직접..