5. 상품 클릭 관리
시청자가 장바구니를 누르면 onCart 로 상품 ID 가, 상품·배너를 눌러 구매 페이지로 이동할 때는 onProductClick 으로 주소가 전달됩니다. 콜백을 등록하지 않으면 외부 브라우저로 열립니다.
▲ 상품 목록과 장바구니 버튼이 보이는 플레이어 화면
상품 클릭의 두 가지 동작
상품 영역에서 일어나는 일은 두 갈래입니다.
둘 다 콜백 등록은 선택이고, 등록하지 않으면 플레이어가 기본 동작으로 처리합니다.
| 시청자 동작 | 등록하지 않으면 | 등록하면 |
|---|---|---|
| 상품·배너를 눌러 구매 페이지로 이동 |
외부 브라우저로 열립니다 | 선택onProductClick 으로 주소를 받아 앱 화면에서 처리합니다 |
| 장바구니 담기 | 플레이어가 자체 처리합니다 | 선택onCart 로 상품 ID 를 받아 앱의 장바구니에 담습니다 |
장바구니 연동하기
시청자가 장바구니 버튼을 누르면 상품 ID 가 콜백으로 전달됩니다.
앱은 그 ID 로 자사 장바구니에 상품을 담고 결과를 알립니다.
Kotlin
SauceClient.setLivePlayerCallbackListener(object : LivePlayerCallbackListener { override fun onCart(productId: String) { // productId = 소스 어드민에 등록한 상품 ID // 앱의 장바구니에 담고, 담긴 결과를 사용자에게 알립니다 } // 아래 세 개는 각 담당 페이지에서 다룹니다 (인터페이스라 선언은 필요합니다) override fun onLoginRequest() {} override fun onCouponDownload(couponCode: String) {} override fun onCouponCustom(couponData: String) {} })
✅ 플레이어는 닫히지 않습니다. 장바구니는 상품 상세 위에서 처리되므로 시청이 그대로 이어집니다. 로그인 요청 콜백이 플레이어를 닫는 것과 다릅니다.
전달되는 상품 ID 확인하기
콜백으로 오는 값은 소스 어드민에 상품을 등록할 때 입력한 상품 ID 입니다.
이 값이 앱의 상품 식별자와 같아야 장바구니에 담을 수 있습니다.
| 확인할 것 | 내용 |
|---|---|
| 값의 출처 | 소스 어드민에서 상품을 등록할 때 입력한 고객사 상품 ID 가 그대로 전달됩니다 |
| 맞춰야 할 것 | 앱(자사몰)에서 상품을 조회할 때 쓰는 식별자와 같은 값으로 등록해야 합니다 |
| 비어 있을 때 | 어드민에 상품 ID 를 입력하지 않았다면 빈 문자열이 전달됩니다 |
⚠️ 연동이 안 될 때 여기부터 보세요 — 콜백은 오는데 장바구니에 담기지 않는다면 대부분 이 값이 원인입니다. 빈 문자열이 올 수 있으므로 값이 비어 있는 경우를 먼저 처리하고, 어드민의 상품 등록 정보를 확인하세요.
상품 클릭을 앱 화면으로 연결하기
시청자가 상품이나 배너를 눌러 구매로 이동할 때, 그 시점이 앱에 전달됩니다.
받은 주소로 앱 안의 상품 화면을 열지, 브라우저로 넘길지는 앱이 정합니다.
-
1시청자가 상품 또는 배너의 구매 영역을 누릅니다.
-
2플레이어가 이동할 주소를 서버에서 받아
onProductClick으로 앱에 전달합니다.
이 주소는 어드민에 등록된 값이며 앱에서 지정할 수는 없습니다. -
3앱이 처리 방식을 정합니다. 앱 안의 상품 상세 화면으로 보내거나, 브라우저를 열거나, 주소를 해석해 다른 화면으로 보낼 수 있습니다.
✅ 앱 안에서 구매까지 이어갈 수 있습니다. 시청자가 앱을 벗어나지 않으므로 이탈이 줄고, 로그인 상태·장바구니를 그대로 쓸 수 있습니다.
💡 등록은 선택입니다. 콜백을 두지 않으면 플레이어가 외부 브라우저로 주소를 엽니다. 그대로도 구매는 이어지므로, 앱 안에서 처리하고 싶을 때만
onProductClick 을 등록하세요.
💡 이동 중에도 시청을 이어가려면 — 화면을 벗어날 때 플레이어를 작은 창으로 유지할 수 있습니다. D. PIP 설정하기를 참고하세요.
요청할 수 있는 설정
상품 영역의 표시 방식도 방송 설정으로 제어됩니다.
| 설정 | 기본 동작 | 바꾸면 달라지는 것 |
|---|---|---|
| 상품 목록 표시 방식 | 목록형 | 격자형으로 바꿔 한 화면에 더 많은 상품을 보여줍니다 |
| 구매 버튼 표시 | 사용 안 함 | 상품마다 구매 버튼을 항상 노출합니다 |
| 찜한 상품 | 사용 안 함 | 시청자가 상품을 찜할 수 있습니다. 회원만 사용할 수 있으며 게스트 채팅을 허용한 방송에서는 동작하지 않습니다 |
Updated about 1 hour ago
Did this page help you?