카카오로 로그인하기, 톡 상담하기 기능

카카오싱크(Kakao Sync)
, ,
1

문의 사항에 따라 필요한 정보를 먼저 입력하시면 더 빠르게 대응해 드릴 수 있습니다.

  1. 원하는 결론: 카카오로 로그인하기(카카오싱크) + 카카오 톡 상담하기 기능을 동시에 사용하기를 희망합니다.

카카오로 로그인하기는 카페24에서 카카오싱크로 기능 설정하였습니다
카카오톡 상담하기는 카카오 디벨롭 사이트에서 직접 JS 코드를 입력하여 구축하였습니다

문제는, 톡 상담하기 코드를 삭제 시 카카오톡 로그인이 잘 작동합니다.
하지만 톡 상담하기 JS 코드를 밑에 삽입 시 카카오 로그인하기는 작동하지 않습니다.

반대로 카카오로 로그인하기 버튼을 삭제 시 톡 상담하기는 잘 작동합니다.
정리하면 둘 중 한개만 작동하고 있습니다.

어떻게 해결할 수 있을까요? 두 기능을 사용하고 싶습니다.

저희가 한 거라고는 카페24에서 제공하는 카카오비즈니스 → 카카오싱크 연동과
카카에서 제공하는 톡 상담하기 JS 코드 삽입이 전부입니다.

<로그인 사이트>
https://doneed.co.kr/member/login.html#none

</body>
   
    <!-- hm 카카오 채팅 추가 -->    
    <script>
  window.kakaoAsyncInit = function() {
    Kakao.Channel.createChatButton({
      container: '#kakao-talk-channel-chat-button',
    });
  };

  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = 'https://developers.kakao.com/sdk/js/kakao.channel.min.js';
    fjs.parentNode.insertBefore(js, fjs);
  })(document, 'script', 'kakao-js-sdk');
</script>
  • 퍼머링크 생성이 필요할 경우 (자세한 신청 방법은 가이드 참고)
    • 카카오싱크 퍼머링크의 서비스 랜딩URL:
    • 디벨로퍼스 앱과 연결된 카카오톡 채널의 검색용 아이디:

카카오 로그인 관련 에러(Invalid redirect. 예: KOE006)가 발생할 경우, 가이드를 참고합니다.
카카오 싱크 관련 자주하는 질문은 FAQ를 참고합니다.

2

안녕하세요.

https://www.doneed.co.kr/ 사이트에는 kakao.min.js가 로그되고 있습니다.
동적으로 추가되는 kakao.channel.min.js가 로그인에 영향을 주는 것 같습니다.

아래처럼 해보시겠어요?

    <!-- hm 카카오 채팅 추가 -->    
    <script>
// 제거
$(function(){
    Kakao.Channel.createChatButton({
      container: '#kakao-talk-channel-chat-button',
    });
});

  // 제거
</script>
3

답변 감사합니다 ㅠ_ㅠ 해당 내용대로 입력해보니 톡상담 아이콘이 아예 사라져버립니다 …ㅠㅠ

4

JavaScript SDK가 초기화 되어 있지 않아서 오류가 발생한 케이스 인데요

로그인 페이지에서만 초기화 시키고 있으신거 같아요
kakao.min.js 를 불러오는 태그 바로 아래 초기화 코드 삽입해 보시겠어요?

<script type="text/javascript" src="//developers.kakao.com/sdk/js/kakao.min.js" charset="utf-8"></script>
<script>
Kakao.init("디벨로퍼스의 자바스크립트 앱 키")
</script>
5

정말 감사합니다ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠkakao.min.js 불러오는 태그를 도저히 못 찾겠어서 head 태그 사이에 입력해보니 작동합니다ㅠㅠㅠㅠㅠㅠ! 와 정말 감사합니다 ㅠㅠㅠㅠㅠㅠ