.png){kind=logo}
Implementing the Auction feature
- Print
Implementing the Auction feature
- Print
Article summary
Did you find this summary helpful?
Thank you for your feedback
Shoplive provides a real-time auction feature, and for the auction functionality, a simple development integration is required. To create and conduct a real-time auction for a product, please refer to the following guide:
Add data to enable auction functionality
Participation in auctions is only possible for authenticated users (logged-in users) with the canBid parameter set to true, following the guidelines for authenticating users.
Simple Authentication payload
Property name | Description | Sample | Comment |
|---|---|---|---|
userId (Required) | User ID | shoplive | A value that ensures the uniqueness of a logged-in user |
userName | User Name (Used in the chat window) | User Name | If you don’t specify a name, you can force user input on chat or create it randomly according to the chat settings of the campaign. |
gender | User gender | Empty value (not specified), m (male), f (female) | It allows checking the total/login viewers' data. |
age | User age | 25 | It allows checking the total/login viewers' data. |
custom | Custom data | custom data | Any data can be set up to 1KB. It allows checking the total/login viewers' data. |
userScore | User rating | 10 | If you set the user rating, it allows using it as a standard for personalizing entrance and drawing events according to the rating. Integers are available from -100 to 100. |
userType | User type | VIP | When entering a broadcast with set entry restrictions (Entry Type), you can reference this value to configure access exclusively for specific users (VIP). |
canBid | Eligibility to participate in the auction. | true | It can receive a value of true or false, and depending on this value, it will be divided into states of either eligible for participation or not eligible for participation. |
JWT Authentication payload
Property name | Description | Sample | Comment |
|---|---|---|---|
expiration (Required) | Expiry Time (timestamp) | 1516239022 | Expiry time of token |
userId (Required) | User ID | sample_user_id | A value that ensures the uniqueness of a logged-in user |
name | User name (Used in the chat window) | User Name | If you don't specify a name, you can force user input on chat or create it randomly according to the chat settings of the campaign. |
gender | User gender | Empty value (not specified), m (male), f (female) | It allows checking the total/login viewers' data. |
age | User age | 25 | It allows checking the total/login viewers' data. |
custom | Custom data | custom data | Any data can be set up to 1KB. It allows checking the total/login viewers' data. |
userScore | User rating | 10 | If you set the user rating, it allows using it as a standard for personalizing entrance and drawing events according to the rating. Integers are available from -100 to 100. |
userType | User type | VIP | When entering a broadcast with set entry restrictions (Entry Type), you can reference this value to configure access exclusively for specific users (VIP). |
canBid | Eligibility to participate in the auction. | true | It can receive a value of true or false, and depending on this value, it will be divided into states of either eligible for participation or not eligible for participation. |
Integrate the auction winner exclusive page
Auction winners will be presented with an auction-winning notification sheet.
.png "옥션(1).png")
You can define the desired action for ON_CLICK_BUY_BUTTON, which is triggered when the Purchase button is clicked within the sheet, and utilize it accordingly. Refer to the guide.
Sample code
<script
type="text/javascript"
src="https://static.shoplive.cloud/shoplive.js"></script>
<script>
Let messageCallback = {
/* This is the event triggered when the user clicks the purchase button displayed at the end of the auction.
For reference to the payload, I have redefined it to only console.log the payload without redirecting to a URL. */
ON_CLICK_BUY_BUTTON:(payload)=> {
console.log(payload)
console.log(`winner ${payload.auction.winner.name}`)
console.log(`winningPrice ${payload.auction.winningPrice.value}`)
}
}
cloud.shoplive.init({
accessKey: ACCESS_KEY,
messageCallback: messageCallback,
});
// Set the user userID and userName, and simultaneously pass canBid:true.
cloud.shoplive.setUserObject({userId: “{userId}”, userName: “{userName}”, canBid:true,});
</script>
<div id="shoplive_div"></div>
<script defer>
cloud.shoplive.setPlayer("shoplive_div", {
campaignKey: campaignKey,
isFullScreen: true,
});
</script>