feat: 카카오 JS SDK 전환 - 앱 직접 실행으로 로그인 UX 개선
- claim_form.html, my_page_login.html 카카오 버튼을 JS SDK Kakao.Auth.authorize()로 전환 - 카카오톡 앱 설치 시 앱으로 직접 전환 (원탭 로그인), 미설치 시 웹 폴백 - JS SDK 로드 실패 시 기존 서버 리다이렉트(/claim/kakao/start) 폴백 유지 - app.py: /claim, /my-page 라우트에서 kakao_state 생성하여 템플릿에 전달 - kakao_client.py: birthyear 스코프 제거 (미승인 → KOE205 에러 방지) - docs/kakao-oauth-setup.md: 플랫폼 키, JS SDK 비교, 다른 계정 적립 안내, 콘솔 설정 문서화 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -569,17 +569,17 @@
|
||||
<div style="position: absolute; top: 50%; left: 0; right: 0; height: 1px; background: #e9ecef; z-index: 0;"></div>
|
||||
</div>
|
||||
|
||||
<a href="/claim/kakao/start?t={{ request.args.get('t') }}"
|
||||
<button type="button" onclick="kakaoLogin()"
|
||||
style="display: flex; align-items: center; justify-content: center; gap: 8px;
|
||||
width: 100%; padding: 16px; background: #FEE500; color: #191919;
|
||||
border: none; border-radius: 14px; font-size: 16px; font-weight: 600;
|
||||
text-decoration: none; letter-spacing: -0.3px; transition: all 0.2s ease;
|
||||
letter-spacing: -0.3px; transition: all 0.2s ease; cursor: pointer;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.06);">
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none">
|
||||
<path d="M10 1C4.477 1 0 4.477 0 8.5c0 2.58 1.693 4.847 4.243 6.134l-1.084 3.97a.3.3 0 00.457.338L7.7 16.392c.75.112 1.52.17 2.3.17 5.523 0 10-3.477 10-7.562C20 4.477 15.523 1 10 1z" fill="#191919"/>
|
||||
</svg>
|
||||
카카오로 적립하기
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<div class="alert error" id="alertMsg"></div>
|
||||
|
||||
@@ -732,6 +732,28 @@
|
||||
successScreen.style.display = 'block';
|
||||
}
|
||||
</script>
|
||||
<script src="https://t1.kakaocdn.net/kakao_js_sdk/2.7.4/kakao.min.js"
|
||||
integrity="sha384-DKYJZ8NLiK8MN4/C5P2dtSmLQ4KwPaoqAfyA/DfmOGfnSNqoARCbb2xl4Kh1v6Q"
|
||||
crossorigin="anonymous"></script>
|
||||
<script>
|
||||
// 카카오 JS SDK 초기화
|
||||
if (typeof Kakao !== 'undefined') {
|
||||
Kakao.init('3d1e098107157c5021b73bd5ab48600f');
|
||||
}
|
||||
|
||||
function kakaoLogin() {
|
||||
if (typeof Kakao !== 'undefined' && Kakao.isInitialized()) {
|
||||
Kakao.Auth.authorize({
|
||||
redirectUri: 'https://mile.0bin.in/claim/kakao/callback',
|
||||
scope: 'profile_nickname,profile_image,account_email,name,phone_number,birthday',
|
||||
state: '{{ kakao_state }}'
|
||||
});
|
||||
} else {
|
||||
// JS SDK 로드 실패 시 서버 리다이렉트 폴백
|
||||
window.location.href = '/claim/kakao/start?t={{ request.args.get("t") }}';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
if('serviceWorker' in navigator){navigator.serviceWorker.register('/sw.js').catch(()=>{});}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user