안드로이드 및 아이폰으로 카카오톡 채널 1:1 채팅 Kakao.Channel.chat(...) 사용시

JavaScript
1

안녕하세요
kakao.Channel.chat() 활용에 대해 질문이 있어서 연락드립니다.

가이드상에는

Kakao.Channel.chat({
  channelPublicId: '_xcLqmC' // 카카오톡 채널 홈 URL에 명시된 id로 설정합니다.
});

이렇게 사용하라고 하셨고, 내부를 보니까 window.open을 활용해서 새창을 연 후 카카오톡 어플을 실행하게 되는데,

제가 활용할 어플은 내부정책으로인해 window.open을 통한 가이드 방식으로는 카카오톡 1:1채팅을 못하게 되었습니다.
그래서 window.open(url) 에 해당하는 url을 똑같이 만들어서 anchor tag에 href에 바로 바인딩을 해주는 방식으로 시도하고 있습니다.

 <a href={chatUrl}>
    <KakaoSVG />
    <span>카카오톡 문의</span>
  </a>

하지만 그경우 잘못된 접근이라고 뜨고 인증에 실패하여 페이지에 접근할 수 없다고 합니다.

카톡자체는 폰상에서 로그인및 실행중이고 카톡의 제자신 채팅창에 해당url을 붙인후 이동할 때는 원하는 채널로 이동이 됩니다.
브라우저에서 해당 url을 복사해서 이동하면 똑같이 인증오류가 뜨고요.

위 링크에서 언급한 로그인 및 토큰 할당까지 진행이 되어야 url을 통해서 채팅상담채널로 이동할 수 있는건가요?

2

안녕하세요.

채널 채팅은 토큰과 무관합니다.

아래와 같이 A link 처리해보시겠어요?

https://pf.kakao.com/_xcLqmC/chat
3

안녕하세요 댓글 감사합니다.

네 해당url 처럼 쿼리스트링 빼고 해봤는데 그때는 안드로이드는 잘 되는데, 아이폰이 안되서 아이폰 때문에 url을 동일하게 해보려고 했습니다. 그런데 그렇게 하니 안드로이드, 아이폰 둘다 인증실패로 되지 않더라구요.

https://pf.kakao.com/_xcLqmC/chat

이런 방식으로 했을 때는 (아이폰 6s)의 경우

image

요렇게 만 되고 카카오톡상담채널로 넘어가지 않고
이미지상의 카카오톡에서 시작하기 버튼을 클릭해서도 반응이 없어서 쿼리스트링으로 전달되는 정보를 다 전달해야하나 해서 시도해보고 있었습니다.

말씀으로는 쿼리스트링 필요없이 https://pf.kakao.com/_xcLqmC/chat 이렇게 채팅id만 가진 url로도 충분하다는 말씀이시죠?

4

모바일 브라우저상에서 주소 접근하면 아래와 같이 표시되고 “열기” 선택 시, 카카오톡 실행되어 채팅을 시작하는데요.

" 인증실패" 라는 상황을 이해하지 못했어요. 관련 화면 캡쳐해주시겠어요?

image

5

네 모바일 브라우저(사파리)에서는 해당처럼 말씀하신 팝업버튼이 열리고 실행되는것은 확인했습니다.

https://pf.kakao.com/_xcLqmC/chat 요렇게 진행했을때는 안드로이드건, 아이폰이건 인증오류는 없습니다.

다만 아이폰(6s)의 경우에 어플(저희가 서비스하는 어플내부에서 a tag로 구현시 실행되는 브라우저)상에서 시행했을때는 해당 팝업버튼이 열리지 않고 캡쳐한 이미지만 보이고 있습니다.

아이폰도 카카오톡 채팅채널로 넘어갈 때 https://pf.kakao.com/_xcLqmC/chat만으로도 충분한지만 확인되면 될거 같아요.

https://pf.kakao.com/_xcLqmC/chat 만으로도 충분하다는거죠??

어떤이유로 어플(저희가 서비스하는 어플내부에서 a tag로 구현시 실행되는 브라우저)상에서는

image
image608×1004 44.5 KB

이렇게만 보이고 카카오톡 채널로 넘어가지 않는지는 내부에서 원인을 찾아보면 될 거 같습니다.

인증실패라는 말은 https://pf.kakao.com/_xcLqmC/chat ?쿼리스트링정보 로 a link를 했을 때 안드로이드 아이폰 두종에서 동일하게 발생했던 사항입니다. 이것에 대해서는 원인을 모르겠습니다.(url자체는 인코딩부분까지 동일하게 맞추고 진행했기 때문에…)