Implementing Auction

    Implementing Auction


    Article summary

    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.

    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>