카카오톡api를 이용한 로그인이 팝업은 뜨는데 로그인 화면이 뜨질 않습니다

소스코드 입니다.
image
image

image
사진처럼 이메일 비밀번호 입력 화면이 뜨질 않습니다.
그리고
뜨더라도
닉네임과 프로필사진이 뜨질 않고 로그아웃 버튼도 나오질 않습니다…그러므로 로그아웃도 되질 않죠

  1. 이메일 비밀번호 입력 화면이 뜨질 않습니다.
  2. 닉네임과 프로필사진이 뜨질 않고 로그아웃 버튼도 나오질 않습니다.
  3. 로그인이 계속 유지 되어 새로운 로그인을 할 수 없습니다.

카카오 로그인은 되지만, 아이디/비밀번호 입력 화면을 통해 새로운 카카오 계정을 통해 로그인 시키고 싶다는 의미가 맞나요?

카카오 SDK 제공하는 로그인 기능은 카카오 계정 로그인이 아닌 소셜 로그인 기능으로, 로그인된 카카오 계정을 바탕으로 액세스 토큰을 발급하는 기능입니다. 마찬가지로 SDK에서 제공하는 로그아웃도 액세스 토큰을 만료시킬 뿐, 카카오 계정을 로그아웃 시키지는 않습니다. 현재 로그인된 카카오 계정은 accounts.kakao.com 에서 확인할 수 있고, 로그아웃도 가능합니다.

새로운 계정으로 로그인하는 기능을 제공하시고 싶으시다면 Kakao.Auth.loginForm을 참고해 주세요.

로그인 이후에 닉네임과 프로필 사진을 들고 오고 싶은데 . 로그인 이후에 아무런 동작이 이루어 지지 않습니다. 그건 왜 그런 건가요 … ㅠㅠㅠ 그리고 저렇게 하얀 화면이 뜨는 이유도 모르겠습니다. 로그인 이후에 다시 로그인버튼을 클릭하면 저렇게 하얀 화면이 뜹니다.

20번 라인의 res.properties.profile.profile_image 말고는 문제를 찾기가 힘든데요.
재현할 수 있는 URL 혹은 코드를 텍스트로 받을 수 있을까요?

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport"
	content="user-scalable=no, initial-scale=1.0,
 maximum-scale=1.0, minimum-scale=1.0, width=device-width" />
<title>Custom Login Demo - Kakao JavaScript SDK</title>
<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

<script>
	$(document).ready(function() {
		Kakao.init('35c746c7c031b1c1d304d8dcde651b9f');
		function getKakaotalkUserProfile() {
			Kakao.API.request({
				url : '/v1/user/me',
				success : function(res) {
					$('#kakao-profile').append(res.properties.nickname);
					$('#kakao-profile').append($("<img/>", {
						"src" : res.properties.profile_image,
						"alt" : res.properties.nickname + "님의 프로필 사진"
					}));
				},
				fail : function(error) {
					console.log(error);
				}
			});
		}

		function createKakaotalkLogin() {
			$("#kakao-logged-group.kakao-logout-btn,#kakao-logged-group.kakao-login-btn").remove();
			var loginBtn = $("<a/>", {
				"class" : "kakao-login-btn",
				"text" : "로그인"
			});
			loginBtn.click(function() {

				Kakao.Auth.login({
					persistAccessToken : true,
					persistRefreshToken : true,
					success : function(authObj) {
						getKakaoUserProfile();
						createKakaotalkLogout();
					},
					fail : function(err) {
						console.log(err);
					},
				});
			});
			$("#kakao-logged-group").prepend(loginBtn)
		}

		function createKakaotalkLogout() {
			$("#kakao-logged-group.kakao-logout-btn,#kakao-logged-group.kakao-login-btn").remove();
			var logoutBtn = $("<a/>", {
				"class" : "kakao-logout-btn",
				"text" : "로그아웃"
			});
			logoutBtn.click(function() {
				Kakao.Auth.logout();
				createKakaotalkLogin();
				$("#kakao-profile").text("");
			});
			$("#kakao-logged-group").prepend(logoutBtn);
		}
		
		if (Kakao.Auth.getRefreshToken() != undefined && Kakao.Auth.getRefreshToken().replace(/ /gi, " ") != "") {
			createKakaotalkLogout();
			getKakaotalkUserProfile();
		} else {
			createKakaotalkLogin();
		}

	});
</script>

</head>
<body>

	<div id="kakao-logged-group"></div>
	<div id="kakao-profile"></div>

</body>
</html>

소스코드 텍스트로 올렸어요 .
왜 안되는지 한번 봐주시길 바랍니다.

처음 올려주신 이미지의 37번 라인에서 getKakaotalkUserProfile()이 아닌 getKakaoUserProfile()을 호출하고 있었네요. 수정하신 후 테스트 부탁드립니다.

감사합니다. 오타였네요 ㅠㅠㅠ
그리고 혹시 프로필사진이 안뜨는건 왜그런지 알수 있나요??
카카오톡 프로필 사진이 없으면 원래 아무것도 안뜨나요?
image

프로필 이미지 주소는 정상적으로 보이시나요?