SPA(Nextjs) 환경에서 카톡 공유하기

JavaScript
1

(JS SDK 2.7.4 버전 기준)

안녕하세요 하이브리드 앱 웹뷰 환경에서 카톡 공유하기 관련하여 이슈가 있어 문의드립니다

SDK 구현 상 validation에 실패하거나 카톡 미설치 상황에서, location.href / window.top.location.href를 직접 설정하는 부분이 있는데요. 이로 인해 웹뷰 환경에서 아래와 같은 문제들이 있습니다

  • 다른 host로 이동되며 SPA가 깨짐. 이로 인해 뒤로 돌아와도 redux 등의 데이터 reset
  • (iOS) 상단 네비게이션 바를 미노출하는 서비스의 경우 뒤로 돌아갈 방법이 없음

Nextjs에서 + redux를 쓰면서 + 웹뷰로 서비스를 제공하는 케이스가 많고 모두 같은 문제를 겪을 듯 해서
혹시 해당 이슈들 관련하여 기존에 가이드가 있는지 궁금합니다

2

안녕하세요.

어떠한 어려움이 있으신지 잘 이해 되지 않는데요
카카오톡 미설치 환경에서 location.href 변경 하셔야 하는 이유가 어떻게 되시나요?

3

validation 실패 상황에서 카톡 공유 호출 시 "SDK가“ location을 변경하는게 문제되고 있습니다

4

JS SDK가 intent 스킴이 아닌 오류 페이지로 리디렉션 하는 케이스를 말씀 주신 거군요
구현하신 웹뷰에서 https://sharer.kakao.com/picker/failed로 이동이 감지될 때, 이를 핸들링하시면 좋을것 같습니다.

5

제가 알기론 SDK에서의 href 변경을 외부에서 막을 방법은 없고 sharer 페이지로 넘어가버리면 저희 웹코드 로직이 관여할 수 없으므로

말씀주신 부분은 네이티브 앱에서 이를 제어하는걸로 이해했는데 맞을까요? 문제해결을 직접적으로 도와주실 필요는 없고 이런 케이스(SPA + 하이브리드 앱)많을 것 같아서 기존에 가이드가 있는지만 알려주셔도 됩니다

6

JS SDK가 location.href 사용하여 오류 페이지로 이동 하기에 안드로이드의 경우 shouldOverrideUrlLoading에서 제어 가능하실 것으로 보입니다.

추가로 SPA + 하이브리드 앱 문제 보다는 사용하고 계시는 상태 관리 방법에 따른 이슈로 보이는데요
사용자가 화면을 갱신 하거나, 하이브리드 앱이 백그라운드에 진입하였다 다시 돌아올 경우에도 발생할 수 있습니다.

웹뷰에서 사용자가 페이지를 직접 리로드 하도록 허용하고 계시지는 않겠지만, 중요 상태 관리는 로컬스토리지에 저장하는 방식을 취하는 것도 고려 부탁드립니다.

7

답변 감사합니다 서비스에 참고하겠습니다