<오늘의 학습>
오늘은 프로젝트 3일차 이제 카카오 로그인은 어느정도 마무리 된 것 같다
다들 REST Api를 사용해서 카카오 로그인을 구현한 것 같은데
아직 그럴 정도의 지식도 없고 아무리 카카오 문서를 읽어봐도 이해가 되지 않기에
Javascript로 구현을 해봤다.. 뭔가 눈가리고 아웅의 느낌이 강하게 들지만
지금의 내가 할 수 있는 최선이라고 생각하고 기록을 남긴다.
로그인
window.Kakao.init('본인 javascript 키 넣기');
function kakaoLogin() {
window.Kakao.Auth.login({
scope: 'profile_nickname,profile_image,account_email,gender',
success: function (authObj) {
console.log(authObj);
window.Kakao.API.request({
url: '/v2/user/me',
success: res => {
let accesstoken = Kakao.Auth.getAccessToken()
const kakao_account = res.kakao_account;
console.log(kakao_account);
let nickname = kakao_account['profile']['nickname']
let email = kakao_account['email']
let gender = kakao_account['gender']
let img = kakao_account['profile']['profile_image_url']
console.log(nickname,email,gender)
console.log(accesstoken);
kakaoLogout();
$.ajax({
type: "POST",
url: "/kakao_sign_in",
data: {
username_give: email,
password_give: email,
nickname_give: nickname,
img_give: img
},
success: function (response) {
if (response['result'] == 'success') {
$.cookie('mytoken', response['token'], {path: '/'});
alert(response['msg'])
kakaoLogout()
window.location.replace(`/user/${username}`)
} else {
alert(response['msg'])
}
}
});
}
});
}
});
}로그인 후에 카카오에서 받은 데이터를 ajax로 보내서 내 db에 저장했다
문서도 읽어보고 다른 캠퍼분에게도 물어봤는데 카카오에서 주는 토큰을 사용하기 보다
내 서비스 토큰을 다시 발행해서 하는 걸 권장한다고 해서 그 방식으로 코드를 짜봤다.
(근데 이렇게 하는 거 맞나..?)
팀원들과 상의 후에 카카오 로그인의 경우 바로 프로필을 수정할 수 있게 window.location.replace(/user/${username}) 프로필 수정 페이지로 바로 연결 시켜줬당.
(친절해...)
그 이후 카카오 access token을 제거하기 위해
로그아웃
function kakaoLogout() {
if (!Kakao.Auth.getAccessToken()) {
console.log('Not logged in.')
return
}
Kakao.Auth.logout(function () {
console.log('logout ok\naccess token -> ' + Kakao.Auth.getAccessToken())
console.log(Kakao.Auth.getAccessToken())
})
}로그아웃 코드를 짰다
처음에는 연결끊기 코드를 짜서 엥????? 왜 동의부터 다시 하는 거지 했는데 코드를 잘 못 본거였당.. ㅋㅋ
위 코드를 사용하면 accesstoken을 없애준다고 했다. 카카오 공식 문서에 그렇게 적혀있었으니 맞겠지... 코드가 없어진지 어떻게 확인 할까 하다가 console로 두번이나 찍어봤는데 null이 나오길래 아~ 없어졌구나~~ 하고 치웠다..ㅋㅋㅋㅋㅋ
코드에 태클은 언제든지 환영이며 반박 시 그 말이 다 맞다.
나는 이제 16일차 코린이니까
서버 측 로그인
@app.route('/kakao_sign_in', methods=['POST'])
def kakao_sign_in():
username_receive = request.form['username_give']
password_receive = request.form['password_give']
nickname_receive = request.form['nickname_give']
img_receive = request.form['img_give']
pw_hash = hashlib.sha256(password_receive.encode('utf-8')).hexdigest()
result = db.users.find_one({'username': username_receive, 'password': pw_hash})
if result is not None:
payload = {
'id': username_receive,
'exp': datetime.utcnow() + timedelta(seconds=60 * 60 * 24)
}
token = jwt.encode(payload, SECRET_KEY, algorithm='HS256')
return jsonify({'result': 'success', 'token': token, 'msg' : '카카오 로그인 성공\n초기 비밀번호...변경하셨죠..?ㅠㅠㅠ'})
# 카카오로 로그인이 처음이라면 DB에 저장해서 회원가입을 먼저 시킨다.
else:
doc = {
"username": username_receive,
"password": pw_hash,
"profile_name": username_receive,
"profile_pic": img_receive,
"profile_pic_real": "profile_pics/profile_placeholder.png",
"profile_info": "",
"nickname": nickname_receive,
"address": ''
}
db.users.insert_one(doc)
#DB 업데이트 이후 토큰 발행
payload = {
'id': username_receive,
'exp': datetime.utcnow() + timedelta(seconds=60 * 60 * 24)
}
token = jwt.encode(payload, SECRET_KEY, algorithm='HS256')
return jsonify({'result': 'success', 'token': token, ''msg' : f'아이디와 초기 비밀번호는 "{username_receive}"입니다!\n개인정보를 위해 반드시 변경해주세요!'})카카오로 로그인을 하게 되면 우선 아이디가 DB에 있는지 확인후에 있다면 바로 토큰을 발행해주고 우리 사이트로 로그인을 할 수 있게 해준다.
없다면 데이터를 받아서 DB에 저장 시킨 후(회원가입) 토큰을 발행해준다.
근데 이렇게 하는걸 권장한다고 하던데 타인의 데이터를 맘대로 저장시켜서 막 회원가입 시키고 해도 되는 건가..?
팀원들에게도 말했지만 우선 임시방편 느낌으로 이렇게 진행하고 다음에 더 자세히 알게되면 바꾸자고 했다.. ㅠㅠ 팀원들은 다 천사다.. 멍청하다고 한마디도 안한다! 헤헤
ㅋㅋㅋㅋㅋㅋㅋ 뭐 이것저것 뚝딱뚝딱 했더니 메일 겁나 왔네;;;
--오늘의 한 줄--
머리가 어느정도 컸나?? 짱구를 굴릴 줄 알게 됐나??? 짱구는 못 말려
