=
developers ID = 1123048
SDK version = ^1.9.5
카카오로 로그인 구현하는데, 카카오톡으로 로그인할 때는 아래와 같은 오류 글이 뜨면서,
I/flutter (13293): 카카오톡으로 로그인 실패 {error: misconfigured, error_description: invalid android_key_hash or ios_bundle_id or web_site_url}
동시에 웹사이트로 전환되어 카카오계정으로 로그인 할 때는 아래 사진처럼 계속하기 버튼이 무반응입니다.
=
- AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:label="마이부산로그"
android:name="${applicationName}"
android:icon="@mipmap/appicon"
android:usesCleartextTraffic="true">
<activity
android:name="com.kakao.sdk.auth.AuthCodeHandlerActivity"
android:exported="true">
<intent-filter android:label="flutter_web_auth">
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="kakao3cxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx" android:host="oauth"/>
</intent-filter>
</activity>
</application>
</manifest>
=
- main.dart 속 SDK 초기화
void main() async {
WidgetsFlutterBinding.ensureInitialized();
KakaoSdk.init(
nativeAppKey: '3cxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
// javaScriptAppKey: 'e0xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
);
runApp(MyApp());
}
=
- login_opening_screen.dart 속 카카오 로그인 구현 로직
Future<void> signInWithKakao() async {
setState(() {
_isLoadingKakao = true; // 로딩 시작
});
try {
// 카카오톡이 설치되어 있는지 확인 후, 카카오톡으로 로그인 시도
if (await kko.isKakaoTalkInstalled()) {
try {
await kko.UserApi.instance.loginWithKakaoTalk();
print('카카오톡으로 로그인 성공');
} catch (error) {
print('카카오톡으로 로그인 실패 $error');
// 카카오톡 로그인 실패 시, 카카오 계정으로 로그인 시도
await kko.UserApi.instance.loginWithKakaoAccount();
print('카카오 계정으로 로그인 성공');
}
} else {
// 카카오톡이 설치되어 있지 않은 경우, 카카오 계정으로 로그인 시도
await kko.UserApi.instance.loginWithKakaoAccount();
print('카카오 계정으로 로그인 성공');
}
// 로그인 후 사용자 정보 가져오기
kko.User? kakaoUser = await kko.UserApi.instance.me();
String? email = kakaoUser.kakaoAccount?.email ?? '';
// 유저 정보를 바탕으로 User 객체를 생성
u.User user = u.User(
u_email: email,
u_name: kakaoUser.kakaoAccount?.name ?? '',
u_img_url: kakaoUser.kakaoAccount?.profile?.profileImageUrl ?? '',
u_nick: kakaoUser.kakaoAccount?.profile?.nickname ?? '',
// 기타 필드들 초기화
);
// UserModel 프로바이더를 사용하여 데이터베이스에 유저가 존재하는지 확인
UserModel userModel = Provider.of<UserModel>(context, listen: false);
bool userExists = await userModel.checkUserExists(email: email);
if (userExists) {
// 유저가 이미 존재하면 로그인 함수 호출
await userModel.kakaoLoginUser(user: user);
} else {
// 유저가 존재하지 않으면 등록 함수 호출
await userModel.kakaoRegisterUser();
}
// 로그인 성공 시, 팝업 닫기 및 메인 페이지로 이동
Navigator.of(context).pop(); // 팝업 닫기
Navigator.of(context).pushReplacement(
MaterialPageRoute(builder: (context) => RootScreen()),
);
} catch (error) {
print('카카오 로그인 실패 $error');
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('카카오 로그인에 실패했습니다.'),
),
);
} finally {
setState(() {
_isLoadingKakao = false; // 로딩 종료
});
}
}