Nodejs - Oauth (kakao)

정종찬·2022년 5월 19일
0
 - https://developers.kakao.com/console/app

- 애플리케이션 추가하기
- REST API 키 메모 
- 플랫폼 설정하기 - Web 플랫폼 등록
- 사이트 도메인 입력 (http://localhost:3005)
- 카카오 로그인 사용 시 Redirect URI를 등록해야 합니다. 등록하러 가기 
- 활성화설정 ON
- Redirect URI 등록 (http://localhost:3005/auth/kakao)
- 동의항목 체크 (닉네임, 프로필사진, 카카오계정, 카카오메시지 전송 등) 필수동의 및 선택동의 - 사용자에게 값이 없는 경우 카카오 계정 정보 입력을 요청하여 수집
- 보안 Client Secret 코드 생성 / 활성화 사용

https://developers.kakao.com/docs/latest/ko/kakaologin/rest-api
step 1 / step 2 / step 3 순서대로 하기
 
npm install express cors nunjucks axios qs
auth.js

const express = require('express')
const app = express()
const cors = require('cors')
const nunjucks = require('nunjucks')
const axios = require('axios')
const qs = require('qs') // {a : 'asdf', b : 'aa' } => a=asdf&b=aa

/*
REST API 키	
Redirect URI : http://localhost:3005/auth/kakao
Client Secret코드	
*/

const client_id = ''
const redirect_uri = 'http://localhost:3005/auth/kakao'
const client_secret = ''
const host = 'https://kauth.kakao.com'

app.set('view engine', 'html')
nunjucks.configure('views', {
    express:app,
})

app.use(cors())

app.get('/', (req, res)=> {
    res.render('index')
})

app.get('/kakao/login', (req, res)=> {
    const redirect = `${host}/oauth/authorize?client_id=${client_id}&redirect_uri=${redirect_uri}&response_type=code`
    // /oauth/authorize?client_id=${REST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code
    res.redirect(redirect) // 실제 kakao 주소로 보낼거에요
})

app.get('/auth/kakao', async (req, res)=> { // 에러나려나?
    const {query:{code}} = req

    // axios 
    // 1. url
    // 2. data = body 내용
    // 3. header = option
    const body = qs.stringify({
        grant_type : 'authorization_code',
        client_id,
        redirect_uri,
        code,
        client_secret
    })
    const headers = { 'Content-type' : 'application/x-www-form-urlencoded;charset=utf-8' }
    const response = await axios.post(`${host}/oauth/token`, body, headers) // 리턴값 프로미스
    console.log(response.data)

    try { 
        const { access_token } = response.data
        const url = 'https://kapi.kakao.com/v2/user/me'
        const userinfo = await axios.post(url, null, {
            headers : {
                "Authorization": `Bearer ${access_token}`,
                "Content-type": "application/x-www-form-urlencoded;charset=utf-8"
            }
        })

        console.log( userinfo.data )
    } catch (e) {

    }

    
    res.send('hello')
})

app.post('/oauth/token', (req, res) =>{
    
})

app.listen(3005, ()=>{
    console.log('서버시작')
})

views/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <a href="/kakao/login">카카오 로그인</a>
</body>
</html>
    등록된 카카오계정 서비스해지 하기
    카카오톡
    ...
    상단메뉴에 톱니바퀴
    개인/보안
    개인정보 관리
    하단 드래그 -> 카카오계정 및 연결된 서비스
    하단 드래그 -> 연결된 서비스 관리 
    외부 서비스 ->



profile
dalssenger

0개의 댓글