It can be useful to tag each address book with an identifier from your own system. We provide an option, userToken, to make this possible. When initializing the widget, specify a value for userToken in the options and we’ll return this identifier as a property of the owner contact.

Specify your own value for the userToken here:

After the address book has been accessed, the returned userToken value will appear below:

Go ahead and connect your address book by clicking the link below to see the magic! 🎩

Add from Address Book

Show Code

<!-- replace 'localhost-only' with your key if you want to run this outside of your localhost environment -->
<script src="https://api.cloudsponge.com/widget/localhost-only.js"></script>
<script>
  // this just updates the output element with a given value
  function setUserTokenOut(val) {
    document.getElementById("userTokenOut").innerText = val;
  }
  // here's the magic:
  cloudsponge.init({
    // send the userToken to CloudSponge to associate it with this user's address books
    userToken: userToken,
    // that's the only thing required! what follows is just some code the make the userToken
    //  interact with this page
    // clear the userToken display when an import starts
    beforeImport: function() {
      setUserTokenOut('');
    },
    // when the import ends, display the userToken that we got from the contacts
    //  so that someone using this page can compare it with what they input
    beforeDisplayContacts: function(contacts, source, owner) {
      setUserTokenOut(owner.userToken);
    },
    // hide the contacts display because we're not interested in seeing it for this demonstration:
    skipContactsDisplay: true,
    // since we hide the contacts display, let's turn off the browser cache, it doesn't play well
    browserContactCacheMin: 0
  });
</script>