문의 시, 사용하시는 개발환경과 디벨로퍼스 앱ID를 알려주세요.
ID 1013571
리액트 네이티브
안녕하세요! 현재 앱내에서 카카오 로그인 등록 되어 있구 작동은 잘 합니다.
그런데 앱을 처음 사용하는 첫 1회 로그인 눌렀을때는 카카오 계정(이메일) 과 비밀번호를 직접 입력하도록 되더라구요.
물론 해당 폼 입력 이후에는 곧바로 로그인이 되긴 합니다. 그렇지만 첫1회부터 카카오 로그인을 누르면 이용정보 동의만 받고 곧바로 회원가입 되게 하려면 카카오싱크로 적용을 시켜야하는건가요 아니면 따로 개발설정에서 다뤄야하는 문제인가요ㅕ??
카카오 로그인을 위해서는 우선 카카오 계정 로그인이 수반되어야 합니다.
카카오톡을 이용한 로그인은 톡에 카카오 계정 세션이 존재하기에 바로 동의화면이 노출되지만
웹 브라우저를 이용하는 로그인은 브라우저 세션에 카카오 계정 세션이 존재하지 않는경우 사용자 식별을 위해 ID/PW를 입력하는 화면으로 변경됩니다.
이는 정상적인 흐름입니다.
다른 앱들의 경우 첫 회원가입 시에 그냥 바로 이용정보 동의만 받고 따로 계정정보(id,pw) 입력할 필요 없이 곧바로 되는곳들도 있던데 그런 플로우를 적용시키려면 어떻게 해야하는건가요?
웹에서 바로 동의화면이 표시되는 것은 브라우저에 계정 세션이 존재하는 경우 입니다.
앱이 어떤 형태인가요? 웹뷰인가요? 아니면 네이티브인가요?
네이티브 형식입니다…!
카카오 로그인 구현하신 코드 보여주실 수 있을까요?
import React, { useState } from 'react';
import {
KakaoOAuthToken,
KakaoProfile,
getProfile as getKakaoProfile,
login,
loginWithKakaoAccount,
logout,
unlink,
} from '@react-native-seoul/kakao-login';
import client, { applyToken } from "../api/client";
import { User } from '../api/types';
import useInform from "../hooks/useInform";
import { useUserState } from '../contexts/UserContext';
import authStorage from "../storages/authStorage";
import { Alert } from 'react-native';
import { useNavigation } from '@react-navigation/native';
interface resultAuth {
statusCode: string;
message: string;
jwt: string;
user: User;
}
export default function useKakaoLogin() {
const navigation = useNavigation();
const [jwt, setJwt] = useState('');
const inform = useInform();
const [, setUser] = useUserState();
const signInWithKakao = async (): Promise<void> => {
try {
//const token: KakaoOAuthToken = await login();
const token: KakaoOAuthToken = await loginWithKakaoAccount();
const profile: KakaoProfile = await getKakaoProfile();
//console.log(profile);
if (!token || !profile) {
return;
}
const params = {
'snsid': profile.id,
'snstype': "kakao",
'snsnick' : profile.nickname,
'snsimg' : profile.thumbnailImageUrl
}
const response = await client.post<resultAuth>(
'/login-sns-check.php',
null,
{ params },
)
const data = response.data;
if (data.statusCode != "100" && data.statusCode != "101") {
Alert.alert("로그인 실패", "처리중 문제가 발생하였습니다.");
return;
}
if(data.statusCode == "101"){
setUser(data.user);
authStorage.set(data);
//navigation.navigate("Mypage", {snsid:snsid, snstype:'naver',snsemail:snsemail, snsname : snsname, snspassword: snspassword})
navigation.reset({routes: [{name: "MainTab"}]})
return;
}
navigation.reset({routes: [{name: "MainTab"}]})
} catch (e) {
console.log(e);
}
};
// 카카오톡 로그인 끝
return signInWithKakao;
}
입니다.
웹뷰를 이용한 계정 로그인 방식(ID/PW입력 방식)을 사용하고 계신데요
웹뷰에 계정 세션이 남아 있기에 ID/PW를 입력화면으로 이동하지 않았습니다.
이는 정상적인 동작입니다.
혹시 여기서 간편가입을 사용하면 이용자가 처음 가입할때 id/pw 값을 입력하지 않고도 가입이 가능한가요??