모아보기 인증 기능 사용법

게스트(비로그인) 사용자로 사용하기

자바 스크립트와 스타일을 페이지에서 불러오기 위해서는 아래의 코드의 적용이 필요합니다.

<div id='sauce_collect'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>
  window.SauceWebLib.setInit({ partnerId: 'service1234' });
  window.SauceWebLib.load() 
</script>

간편 인증 사용하기 (일반 텍스트 형식의 nickName 및 memberId)

비회원, 간편 인증, JWT 인증 방식을 지원합니다.

실 <div id='sauce_collect'></div>
  <script>
    window.SauceWebLib.setInit({ partnerId:  'service1234' });
    window.SauceWebLib.setMemberObject({
      memberId: 'saucelive',
      nickName: '소스라이브***',
      age: '10',
      gender: 'm'
     });
    window.SauceWebLib.load()
  </script>

실제 사용 예시는 아래와 같습니다.

 <div id='sauce_collect'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>
    // 현재 고객이 로그인되어있는지 확인할수 있는 고객사 API를 사용합니다.  
   const response  = await fetch(`YOUR API`);
    // 고객사 API 에서 실제적으로 고객을 파악할수 있는 ID 와 이름 혹은 닉네임을 추출합니다.
   const { memberId,nickName,name } = await response.json();
   // 모비두 가입시 확인 받은 파트너ID 를 입력 해주세요
   const partnerId  = params.get('broadcastId');
    if(memberId && partnerId ){
    window.SauceWebLib.setInit({ partnerId:  partnerId });
    window.SauceWebLib.setMemberObject({
      memberId: memberId,
      // 채팅창에 표기되는 이름입니다. 닉네임 혹은 이름을 입력해주세요
      nickName: nickName ?? name ,
     });
    window.SauceWebLib.load()
     // 멤버ID 등이 존재하지 않으면 비로그인으로 모아보기를 실행시킵니다.
  } else if (partnerId) {
     window.SauceWebLib.setInit({ partnerId:  'uiux' });
     window.SauceWebLib.setMemberToken('')
     window.SauceWebLib.load();
   }
</script>

JWT 인증 사용하기

간편 인증과 JWT 인증으로 사용자 정보를 연동할 수 있습니다.

간편 인증은 빠르고 간편하게 인증 사용을 할 수 있지만, 보안 강화와 임의의 사용자 ID가 어뷰징 되는 것을 방지하기 위해 JWT 인증을 할 수 있습니다. 자세한 사항은 JWT Token 생성 을 참고해주세요.

<div id='sauce_collect'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.setMemberToken(JWT:string)
   window.SauceWebLib.load() //default 'sauce_collect'
</script>