GuidesAPI GuideChangelog
Log In
Guides

5. 상품 클릭 관리

시청자가 장바구니를 누르면 onCart 로 상품 ID 가, 상품을 눌러 구매 페이지로 이동할 때는 onProductClick 으로 주소가 전달됩니다. 콜백을 등록하지 않으면 아무 동작도 하지 않습니다.

5. 상품 클릭 관리 — 소스라이브 플레이어 Android SDK
예상 소요 시간: 10분
📋 사전 조건: 소스 어드민에 상품이 등록되어 있을 것
상품 목록과 장바구니 버튼이 있는 상품 패널
▲ 상품 목록과 장바구니 버튼이 보이는 플레이어 화면
상품 클릭의 두 가지 동작

상품 영역에서 일어나는 일은 두 갈래입니다.
둘 다 앱이 콜백으로 받아 처리하며, 등록하지 않으면 아무 동작도 하지 않습니다.
배너는 성격이 달라 별도 콜백으로 옵니다.

시청자 동작등록하지 않으면등록하면
상품을 눌러
구매 페이지로 이동
아무 동작도 하지 않습니다 onProductClick 으로 주소를 받아 앱 화면에서 처리합니다
장바구니 담기 아무 동작도 하지 않습니다 onCart 로 상품 ID 를 받아 앱의 장바구니에 담습니다
장바구니 연동하기

시청자가 장바구니 버튼을 누르면 상품 ID 가 콜백으로 전달됩니다.
앱은 그 ID 로 자사 장바구니에 상품을 담고 결과를 알립니다.

Kotlin
SauceClient.setLivePlayerCallbackListener(object : LivePlayerCallbackListener {
    override fun onCart(productId: String) {
        // productId = 소스 어드민에 등록한 상품 ID
        // 앱의 장바구니에 담고, 담긴 결과를 사용자에게 알립니다
    }

    override fun onLoginRequest(context: LoginRequestContext) {}   // 필수
})
📘 플레이어는 닫히지 않습니다. 장바구니는 상품 상세 위에서 처리되므로 시청이 그대로 이어집니다.
전달되는 상품 ID 확인하기

콜백으로 오는 값은 소스 어드민에 상품을 등록할 때 입력한 상품 ID 입니다.
이 값이 앱의 상품 식별자와 같아야 장바구니에 담을 수 있습니다.

확인할 것내용
값의 출처 소스 어드민에서 상품을 등록할 때 입력한 고객사 상품 ID 가 그대로 전달됩니다
맞춰야 할 것 앱(자사몰)에서 상품을 조회할 때 쓰는 식별자와 같은 값으로 등록해야 합니다
비어 있을 때 어드민에 상품 ID 를 입력하지 않았다면 빈 문자열이 전달됩니다
⚠️ 연동이 안 될 때 여기부터 보세요 — 콜백은 오는데 장바구니에 담기지 않는다면 대부분 이 값이 원인입니다. 빈 문자열이 올 수 있으므로 값이 비어 있는 경우를 먼저 처리하고, 어드민의 상품 등록 정보를 확인하세요.
상품 클릭을 앱 화면으로 연결하기

시청자가 상품을 눌러 구매로 이동할 때, 그 시점이 앱에 전달됩니다.
받은 주소로 앱 안의 상품 화면을 열지, 브라우저로 넘길지는 앱이 정합니다.

  • 1
    시청자가 상품의 구매 영역을 누릅니다.
  • 2
    플레이어가 이동할 주소를 서버에서 받아 onProductClick 으로 앱에 전달합니다.
    이 주소는 어드민에 등록된 값이며 앱에서 지정할 수는 없습니다.
  • 3
    앱이 처리 방식을 정합니다. 앱 안의 상품 상세 화면으로 보내거나, 브라우저를 열거나, 주소를 해석해 다른 화면으로 보낼 수 있습니다.
Kotlin
override fun onProductClick(info: ProductClickInfo): Boolean {
    // info.url = 이동할 구매 페이지 주소, info.productId = 어드민에 등록한 상품 ID
    openProductScreen(info.url)
    return true   // 앱이 처리했음. false 면 플레이어는 아무 동작도 하지 않습니다
}
📘 앱 안에서 구매까지 이어갈 수 있습니다. 시청자가 앱을 벗어나지 않으므로 이탈이 줄고, 로그인 상태·장바구니를 그대로 쓸 수 있습니다.
📘 콜백을 등록하지 않으면 이동하지 않습니다. 앱 안에서 처리하려면 onProductClick 을 등록하세요.
📘 이동 중에도 시청을 이어가려면 — 화면을 벗어날 때 플레이어를 작은 창으로 유지할 수 있습니다. 설정 방법은 D. PIP 설정하기에 있습니다.
배너 클릭 연동하기

상단 배너와 슬롯 배너는 상품과 다른 콜백으로 옵니다.
어드민에 등록할 때 열림 방식을 함께 정하고, 그 값이 targetType 으로 전달됩니다.

Kotlin
override fun onBannerClick(info: BannerClickInfo): Boolean {
    // info.url · info.bannerId · info.placement · info.targetType (SELF / BLANK)
    openInAppBrowser(info.url)
    return true   // 앱이 처리했음
}
전달값설명
info.url이동할 주소
info.bannerId어드민에 등록한 배너 식별자
info.placement눌린 위치 — 상단 배너인지 슬롯 배너인지
info.targetTypeSELF 또는 BLANK. 어드민에서 정한 열림 방식입니다
info.isAppScheme주소가 앱 스킴이면 true
📘 등록하지 않으면 targetType 에 따라 갈립니다. BLANK 는 외부 브라우저로 열리고, SELF 는 아무 동작도 하지 않습니다. 두 경우 모두 앱 안에서 처리하려면 콜백을 등록하고 true 를 돌려줍니다.
요청할 수 있는 설정

상품 영역의 표시 방식도 방송 설정으로 제어됩니다.

설정기본 동작바꾸면 달라지는 것
상품 목록 표시 방식목록형격자형으로 바꿔 한 화면에 더 많은 상품을 보여줍니다
구매 버튼 표시사용 안 함상품마다 구매 버튼을 항상 노출합니다
찜한 상품사용 안 함시청자가 상품을 찜할 수 있습니다. 회원만 사용할 수 있으며 게스트 채팅을 허용한 방송에서는 동작하지 않습니다
📘 설정 변경 문의모비두 담당자 또는 카카오톡 채널로 요청하세요.


Did this page help you?
🏠 소스라이브 🎬 소스클립 🔗 소스링크 📢 소스애드
🧩 API 가이드
🆕 최근 업데이트
💬 도움이 더 필요하신가요?
메일로 문의 카카오톡 채널로 문의
담당자에게 문의하기

궁금한 점이나 불편했던 점을 남겨주시면 담당자가 확인 후 답변드릴게요.

가이드 챗봇 BETA
* AI를 활용해 답변해서 사실과 다를 수도 있어요. 더 궁금한 사항은 '담당자에게 문의하기'를 이용해주세요.
💡 궁금한 솔루션(예: 라이브, 링크 등)을 함께 적어주시면 더 정확한 답변을 받을 수 있어요.