브랜드 좋아요 기능 연동하기

📘

이 기능을 활성화하기 위해서는 Shoplive와 협의가 필요합니다.

Shoplive와 사전 협의를 통해 브랜드 좋아요 기능을 연동할 수 있습니다.

브랜드 좋아요 기능을 사용하기에 앞서 브랜드 생성 및 설정이 필요합니다.

브랜드 생성 및 설정하기

브랜드 좋아요 기능 연동을 위해 다음 가이드를 참고해주세요.


messageCallback

브랜드 좋아요 클릭 시 호출되는 messageCallback입니다. 이를 통해 브랜드 좋아요 이벤트를 정의할 수 있습니다.

actionpayload설명
SET_FAVORITE_BRANDjson object브랜드 좋아요 클릭 시 호출되는 message Callback 입니다.

Payload 객체

NameTypeExampleDescription
favoritebooleantrue | false브랜드 좋아요 체크 여부
identifierstringshoplive브랜드 식별명

샘플 코드

Shoplive 플레이어에서 브랜드 좋아요 버튼 클릭 시 호출되는 messageCallback을 정의하기 위한 샘플 코드입니다.


  var messageCallback = {
    
    // 브랜드가 설정되어있는 방송의 플레이어가 시작될때, 또는 실시간으로 브랜드 정보가 변경될때 호출되는 이벤트.
    ON_CHANGED_BRAND_FAVORITE: function(payload) {

      const { identifier } = payload; // 방송에 설정되어있는 브랜드의 identifier
      // 현재 사용자의 브랜드 좋아요 상태를 변경할 수 있습니다.
      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)
      }
    },
    
    // 사용자가 "브랜드 좋아요" 버튼을 누르면 호출되는 이벤트.
    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) => {
        // 브랜드 좋아요 처리 결과를 success에 담아 반환한 경우
        if (res.success) {
          alert(`${identifier} 브랜드를 즐겨찾기에 등록했습니다.`);
        } else {
          alert(`${identifier} 브랜드를 즐겨찾기에서 해제습니다.`);
        }
      });
    },
  }

  // brand 좋아요 상태를 지정하여 플레이어를 시작하기.
  var options = {
    messageCallback: messageCallback,
    brand: {
      identifier: "YOUR_BRAND_IDENTIFIER", 
      favorite: true,
    },
  };

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