目次 x
    ブランドお気に入り機能の実装
      • 印刷する
      目次

      ブランドお気に入り機能の実装

        • 印刷する
        記事の要約

        機能の有効化

        この機能を有効にするには、Shopliveにお問い合わせください

        ブランドのお気に入り機能を使用する前に、ブランドを作成して設定する必要があります。

        ブランド設定

        ブランドのお気に入り機能の実装については、以下のガイドを参照してください。

        メッセージコールバック

        ユーザーがブランドのお気に入りのボタンをクリックしたときにトリガーされる messageCallback を実装することで、必要な機能を定義できます。

        アクション

        ペイロード

        説明: __________

        ON_CHANGED_BRAND_FAVORITE

        campaignKey (文字列)

        ブランドのあるキャンペーンのプレーヤーが開始されたとき、またはブランド情報がリアルタイムで変更されたときに呼び出されるイベントです

        ON_CLICK_BRAND_FAVORITE_BUTTON

        coupon (文字列)

        type (文字列)

        「Brand Favorite」をクリックすると呼び出されるイベント

        SEND_COMMAND_MESSAGE

        SEND_COMMAND_MESSAGEは、sendMessage()によって発火されるコマンドの一種であり、以下のアクションとペイロードを配信できます。

        アクション

        ペイロード

        説明: __________

        SET_FAVORITE_BRAND

        json object

        messageCallback called on clicking the brand favorite button

        ペイロード オブジェクト

        名前

        種類

        例

        説明: __________

        お気に入り

        ブーリアン

        真 |偽

        ブランドのお気に入りかどうか

        識別子

        糸

        ショップライブ

        ブランド識別名

        サンプルコード

        これは、プレーヤーでブランドのお気に入りボタンがクリックされたときに呼び出されるmessageCallbackを定義するためのサンプルコードです。

        
  var messageCallback = {
    
    // Event that is called when the player for a livestream with a brand is started, or when brand information is changed in real time.
    ON_CHANGED_BRAND_FAVORITE: function(payload) {

      const { identifier } = payload; // Brand identifier that is set
      // You can change the current user's brand favorite status.
      if( identifier === "USER_FAVORITE_BRAND_IDENTIFIER" ) {
        const commandPayload = {
          command: "SET_BRAND_FAVORITE",
          payload: { identifier: identifier, favorite: true  }
        }
        const player = cloud.shoplive.getPlayer();
        
        player.sendMessage("SEND_COMMAND_MESSAGE", commandPayload)
      }
    },
    
    // Event that is called on clicking "Brand Favorite"
    ON_CLICK_BRAND_FAVORITE_BUTTON: function (payload) {
      const { favorite, identifier } = payload;
      console.log(identifier, favorite);
        fetch("favorite save api address")
        .then((res) => res.json())
        .then((res) => {
        // In case the brand favorite processing result is returned in success.
        if (res.success) {
          alert(`${identifier}를 has been added to favorite`);
        } else {
          alert(`${identifier}를 has been removed from favorite`);
        }
      });
    },
  }

  // Starting the player by specifying the brand favorite status.
  var options = {
    messageCallback: messageCallback,
    brand: {
      identifier: "YOUR_BRAND_IDENTIFIER", 
      favorite: true,
    },
  };

  cloud.shoplive.init({ accessKey: 'YOUR ACCESS KEY HERE', messageCallback: messageCallback });

        What's Next