내 코드에서 카카오가 로그인되지 않는 이유를 아시는분

문의 시 사용하시는 SDK 버전 정보와 플랫폼(Android / iOS) 및 디벨로퍼스 앱ID를 알려주세요.


SDK 버전 : ‘>=3.0.6 <4.0.0’
앱 아이디 : 998647

안녕하세요 ! 이번에 학교 프로젝트 겸 취미로 앱을 개발하는 사학과 1학년입니다! 아직 3개월차라 매우 미숙한 점 죄송합니다… 다름이 아니라 학교 프로젝트로 논문 정보 관련된 어플을 개발중에 있습니다! 그래서 로그인 기능 중 카카오 로그인을 구현하려고 하는데 문제가 생겼습니다.

https://www.youtube.com/watch?v=Ar6RdDf77xQ&t=437s
이 영상을 보고 깃허브에서 코드를 참고하여 제작했는데 크롬 에뮬레이터? (핸드폰 에뮬레이터는 제 컴퓨터가 너무 성능이 좋지 않아 켜지지 않아 크롬으로 실행했습니다…) 로그인을 한 뒤에도 사진이랑 닉네임이 반영되지 않습니다, 혹시 어떤게 문제일까요 …

import ‘package:chamgohae1/Login_page/Loginpage2.dart’;
import ‘package:chamgohae1/Login_page/Viewmodel.dart’;
import ‘package:flutter/material.dart’;
import ‘package:chamgohae1/main/Setting.dart’;
import ‘package:chamgohae1/main/QnAPage.dart’;
import ‘package:chamgohae1/main/main.dart’;
import ‘package:provider/provider.dart’;
import ‘package:kakao_flutter_sdk_user/kakao_flutter_sdk_user.dart’;
import ‘package:chamgohae1/UserProvider/User_Provider.dart’;
import ‘package:chamgohae1/main/Customer.dart’;
import ‘package:url_launcher/url_launcher.dart’;

void main() {
KakaoSdk.init(nativeAppKey: ‘033ae651eac2b2c9d95f492284197bdb’);
runApp(const MyApp());
}

class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);

// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: ‘Flutter Demo’,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const TabScreen3(),
);
}
}

class TabScreen3 extends StatefulWidget {
const TabScreen3({Key? key,}) : super(key: key);

@override
State createState() => _TabScreen3State();
}

class _TabScreen3State extends State {
final viewModel = MainViewModel(KakaoLogin());

@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
padding: EdgeInsets.zero,
children: [
UserAccountsDrawerHeader(
currentAccountPicture: CircleAvatar(
child: Image.network(
viewModel.user?.kakaoAccount?.profile?.profileImageUrl ?? ‘’),
),
accountName: Text(
‘${viewModel.isLogined}’,
style: TextStyle(color: Colors.white),
),
accountEmail: Text(
‘pbj0618@naver.com’,
style: TextStyle(color: Colors.white),
),
decoration: BoxDecoration(
color: Color(0xff1D3557),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(40.0),
bottomRight: Radius.circular(40.0),
),
),
),
ListTile(
leading: Icon(
Icons.login,
color: Colors.grey[850],
),
title: Text(‘카카오 로그인’),
autofocus: true,
onTap: () async {
await viewModel.login();
setState(() {});
},
trailing: Icon(Icons.add),
),
ListTile(
leading: Icon(
Icons.logout_outlined,
color: Colors.grey[850],
),
title: Text(‘카카오 로그아웃’),
onTap: () async {
await viewModel.logout();
setState(() {});
},
trailing: Icon(Icons.add),
),
],
),
);
}
}
이렇게 구성되어 있고
https://github.com/pbj0618/chamgohae2/blob/master/lib/main/TabScreen/TabScreen3.dart
제 깃허브 링크입니다… 봐주시면 감사하겠습니다 ㅠㅠ 아직 20살이고 사학과라 주위에 전문가가 없어서 요기에 도움이라도 청해봅니다…

안녕하세요.

(1) 기재하신 코드내 KakaoSdk.init(nativeAppKey 에 사용된 앱키가 998647 디벨로퍼스앱의 키가 아닙니다. 확인해주세요.

(2) 998647 디벨로퍼스앱에서 카카오 로그인 시, 액세스 토큰 발급 시점에 아래와 같이 에러 발생하고 있습니다.

{"error":"misconfigured","error_description":"invalid android_key_hash or ios_bundle_id or web_site_url","error_code":"KOE009"}

구동되는 사이트 도메인 http://localhost:54709 를 디벨로퍼스 웹도메인 설정에 등록해주세요.

디벨로퍼스 가이드와 데브톡 문의 사례들을 확인하시며 빈프로젝트에 카카오 로그인만 따로 적용하셔서
외부 변수를 줄이고 학습하시면 좀더 수월하게 진행 하실 수 있을 것 같습니다.

참고 부탁드려요ㅣ

1개의 좋아요