Guides

Use Collection Authentication

Using as a Guest (Non-Logged-in User)

To load the JavaScript and styles on your page, you need to include the following code.

<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>

Using Simple Authentication (Plain Text nickName and memberId)

Supports guest, simple authentication, and JWT authentication methods.

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

Example: Using Simple Authentication

<div id='sauce_collect'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>
    // Use your own API to check whether the user is currently logged in.
   const response  = await fetch(`YOUR API`);
    // Extract the user’s unique memberId and name or nickname from your API response.
   const { memberId,nickName,name } = await response.json();
   // Enter the partnerId provided during your Mobidoo onboarding.
   const partnerId  = params.get('broadcastId');
    if(memberId && partnerId ){
    window.SauceWebLib.setInit({ partnerId:  partnerId });
    window.SauceWebLib.setMemberObject({
      memberId: memberId,
      // nickName is the name displayed in the chat window. Use either nickname or name.
      nickName: nickName ?? name ,
     });
    window.SauceWebLib.load()
     // If memberId is not available, the Collection will run in guest mode.

  } else if (partnerId) {
     window.SauceWebLib.setInit({ partnerId:  'uiux' });
     window.SauceWebLib.setMemberToken('')
     window.SauceWebLib.load();
   }
</script>

Using JWT Authentication

You can connect user information using either simple authentication or JWT authentication.

While simple authentication is quick and easy to implement, JWT authentication is recommended to enhance security and prevent abuse of arbitrary user IDs. See Generate JWT Tokenfor more information.

<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>

Example: Using JWT Authentication

<div id='sauce_collect'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>
    // Use your own API to check whether the user is currently logged in.
   const response  = await fetch(`YOUR API`);
    // Retrieve a JWT from your API response.
   const { token } = await response.json();
    if(token ){
    window.SauceWebLib.setInit({ partnerId:  partnerId });
   window.SauceWebLib.setMemberToken(token)
    window.SauceWebLib.load()
  } else if (partnerId) {
     window.SauceWebLib.setInit({ partnerId:  'uiux' });
     window.SauceWebLib.setMemberToken('')
     window.SauceWebLib.load();
   }
</script>