Web

이 페이지에서는 Web SDK 인앱 캠페인 테스트 가이드를 안내합니다.

사전 작업

이 문서는 Web SDK 연동 완료 이후 인앱 메시지 수신을 테스트하기 위한 방법을 가이드합니다. 아래 문서의 사전 작업을 완료 후 진행해주세요.

Web SDKchevron-rightIn-App Campaign 테스트chevron-right

1. 캠페인 수신 확인

캠페인 테스트 단계에서 설정한 트리거 이벤트인 홈 화면 조회 를 찍도록 이벤트를 추가하고 캠페인이 트리거 되는지 확인해보겠습니다.

코드의 적당한 위치에 홈 화면 조회(mkt_home_view) 이벤트를 추가합니다. 앱 실행 후 해당 코드가 실행되면 캠페인이 트리거되어야 합니다.

// React example

useEffect(() => {
  mtap.track('mkt_home_view')
}, []}

디바이스에서 인앱 메시지가 정상 수신되는지 확인해주세요. 2. 웹앱에서 확인하기 (선택) 으로 이동해서 연동을 추가로 확인해주세요.

1-1. 클릭 확인

캠페인에 클릭 액션 URL이 설정되어 있는 경우, 마켓탭 SDK는 기본 동작으로 다음과 같이 동작합니다.

설정된 URL로 랜딩이 정상적으로 동작하는지 확인합니다.

2. 웹앱에서 확인하기 (선택)

모바일 웹뷰를 통해 웹페이지를 랜더링하는 웹앱일 경우 웹뷰 브릿지 연동이 권장됩니다. 연동을 완료한 경우 이 섹션을 따라 진행해주세요.

2-1. handleInAppInWebView true인 경우 (기본값)

웹뷰 브릿지 연동시 따로 설정을 변경하지 않았다면 handleInAppInWebView true 입니다. 이 때 웹뷰에서 트리거된 인앱 팝업은 웹뷰 위에 html로 랜더링됩니다.

  • 캠페인이 정상적으로 노출되는지 확인합니다.

  • 클릭 시 설정한 클릭 액션 url로 정상 랜딩 되는지 확인합니다.

    • 앱 내 페이지 전환 확인

    • 앱 외부 랜딩 확인 (외부 링크의 경우)

이 때 캠페인 클릭시 랜딩은 1-1. 클릭 확인 과 마찬가지로 window.location.href 를 통해 이루어집니다. 클릭 랜딩이 정상 동작하지 않거나 커스텀 액션이 필요할 때, 이 기본 동작을 비활성화하고 클릭 시 액션을 직접 제어하려면 아래 페이지 안내에 따라 clickHandler 기반 커스텀 연동을 진행해주세요.

커스텀 클릭 핸들러chevron-right

2-2. handleInAppInWebView false인 경우

스크린의 일부에만 웹뷰를 사용하거나 웹뷰 내부 랜딩을 원하지 않는 경우 이 옵션을 사용할 수 있습니다.

MarketapWebBridge(handleInAppInWebView: false) 와 같이 handleInAppInWebView 값을 false로 주입한 경우 인앱 팝업은 웹뷰 내부에 랜더링되지 않고 플랫폼별 팝업 노출 로직에 따라 동작합니다. 플랫폼별 인앱 팝업은 아래 페이지 안내에 따라 진행해주세요.

IOSchevron-rightAndroidchevron-rightFlutterchevron-right

3. 이어서 진행하기

이제 In-App Campaign 테스트가 완료되었습니다. 아래 문서에서 이어서 진행해주세요.

Last updated

Was this helpful?