안녕하세요 이번에 카카오톡 메시지 API 연동 개발 업무를 맡게 되면서 문의사항이 있습니다.
구현 환경은 1번 페이지에서 2번 페이지로 이동
2번 페이지 이동 후 바로 카카오톡 메시지 api 호출하여 사용 시 카카오톡이 열리면서 메시지는 정상적으로 동작합니다( 기능상 동작은 적상)
그러나 카카오톡 호출과 동시에 2번 페이지에서 1번 페이지로 자동으로 이동이 되는 현상이 발생하여 문의 드립니다.
ps.
테스트 환경: LG 스마트폰 크롬, 엣지 브라우저에서 발생
아이폰 사파리에서는 미발생
안녕하세요.
디벨로퍼스에서 제공하는 메시지 API는 카카오톡을 띄우지 않고 페이지 이동에 개입하지 않습니다.
사용하신 기능이 어떤것인지 관련 코드블럭과 앱ID기재해주시겠어요?
메시지API가 아니라 JS SDK를 이용한 카카오톡 공유하기를 사용하신거군요.
카카오톡 공유하기는 메시지발송을 위해
PC에서는 팝업을띄우고
모바일에서는 카카오톡앱을 호출합니다.
말씀하신 페이지 이동은 카카오톡 공유하기 기능과는 무관해보이는데요. 재현가능한 URL 이나 재현 영상 첨부해주시겠어요?
안녕하세요 답변이 늦었습니다. 영상 링크 보내드릴게요
동작 순서 : 1번 페이지 (가입 결제 페이지) > 2번 페이지 (가입 완료 페이지)
동작 설명 :
2번 페이지 이동 후 카카오톡 바로 호출 → 카카오톡 실행 → 네비게이션 바(제일 왼쪽 버튼) 클릭 후 크롬 페이지 선택
2번 페이지가 유지 되어야 하는데 1번 페이지로 강제 이동 되었습니다.
두 영상 모두 모바일인데 카카오 계정 로그인 페이지가 표시되는 것이 이상하네요.
카카오톡 공유하기를 모바일에서 실행하면 바로 카카오톡 앱에서 친구 선택 화면이 표시되야하는데요.
(1) User-agent가 변형되어 잘못작동하는지 확인 필요해보입니다.
(2) 웹페이지가 SPA로 구현되어 있나요? 카카오톡 앱으로 이동했다가 사이트로 돌아왔을때 Dom이 훼손되는 것 아닌지 확인해볼 필요가 있을 것 같아요. 카카오톡 공유하기와 무관하게 구현하신 시스템 리턴 랜딩 문제로 보이긴합니다.
재현 가능한 URL과 앱ID알려주시겠어요?
반복해서 영상을보니 현재 카카오톡이 정상 로그인되어있는 상태가 아닌것같은데요.
그 상황에서는 메시지발송을 못하셨을 것 같은데, 맞나요?
로그인하시고 테스트해주시겠어요?
영상에서는 카카오톡 계정이 없어서 담지 못하였지만 다른 테스트폰에서 실제 로그인된 카카오톡에서 메시지도 잘 보내지고 기능은 잘 동작합니다 (앞서 최초 문의 드린 내용에서 기능은 정상 작동이라고 언급 드렸습니다.)
하지만 페이지 이동 발생 현상은 동일합니다. 그렇기 때문에 영상드린 것처럼 기능에는 문제 없고
카카오톡 호출을 사용자 제스처(이벤트) 없이 바로 호출 하여 발생하는 부분인건지 의심이 됩니다.(클릭 이벤트를 주어지면 해당 현상 미발생)
1번 페이지 와 2번페이지는 별도 html 입니다.
ex)
1번 페이지(order.view.html) → 2번 페이지(order.complete.html) 로 이동
Ps. 구현하신 시스템 랜딩 문제 > 이 부분은 이해가 되지 않습니다. 다른 환경에서는 2번 페이지가 유지되는데
안드로인드 크롬, 삼성브라우저에서는 랜딩 된다는게 이해가 되지 않습니다.
정상 동작 영상으로 첨부해주신 영상이 실제로 공유하기가 작동하지 않는 영상이라 내용 파악이 어려운데요. (재현해볼 수 있는 URL도 없어서 정확한 상황 파악이 어렵습니다.)
말씀하신 것을 토대로
페이지 리다이렉트 후, 로딩 시, 공유하기 스크립트 실행시 정상작동하지 않는다(SDK가 동선에 영향을 준다)가 주요 문제 상황으로 이해했습니다.
말씀하신 것과 유사하게 a.html 에서 b.html로 리다이렉트하고 b.html 로드 시, 카카오 톡 공유하기 정상 처리되는 것이 확인되는데요.
http://test-tam.pe.kr/a.html?test=20230215001
위에서 말씀드린 것 처럼 JS SDK카카오톡 공유하기 기능은 개발하신 페이지의 이동에 개입하지 않습니다.
말씀하신 것처럼 사용자 액션 없이 앱 호출 또는 페이지 이동 시, 리턴 처리되는 android os 작동으로 보입니다.
(history 스택에서 제외 하는 것으로 보입니다.)
(1) 명시적인 사용자 액션으로 처리하시거나
(2) 완료 페이지에서 사용자 액션 없이 스크립트 실행하지말고 이전페이지에서 완료(?)버튼 처리 후 스크립트 실행하거나
(3) 다르게 작동하는 UA환경에서 사용자 동선을 변경하시면 좋을 것같습니다.
해당 만들어주신 테스트 페이지로 이동 후에도 동일 증상 발생하였습니다.
http://test-tam.pe.kr/a.html?test=20230215001
아무래도 android os 작동으로 보이는 것 같습니다.
https://youtube.com/shorts/W9tavnqCeSM?feature=share
A페이지 구성 후 B페이지 이동 > 카카오톡 실행 > 메시지 보내기 완료 > B 페이지가 아닌 A페이지로 강제 이동
안드로이드 스마트폰 크롬에서 확인 부탁드립니다.
안드로이드 OS 문제로 보는게 맞겠죠?
네, OS정책으로 보는게 맞을 것 같습니다. 위에 설명드린 형태로 동선 변경해서 사용하시면 좋을 것 같아요.