UserTagging & Login Example - TeamViewer Support
<main> <article class="userContent"> <p>This usecase describes example steps for using the API to retreive chat history for existing logged-in users. Additionally, visitor sessions should only last for the duration of their browser session. A logout function will reset the chat to an empty state and treat the visitor as a new customer.</p><h2 data-id="1.-setup-session-based-id">1. Setup Session-Based ID</h2><p>Chatvisor gives any user who visits a page which has our JavaScript implemented their own ID. Usually, these IDs are stored and read from localstorage and can last long. In this case we want any user who is not logged in to always be presented with a completely fresh Chat session, even if they have had a conversation before.</p><p>To achieve this, Chatvisor has to be switched to "Session-Based IDs", which are stored in sessionstorage and deleted once the user closes the browser window.</p><p>More information on this setting can be found <a href="https://docs.chatvisor.com/docs/config24_css_module-configuration-co-browsing#session-based-visitor-id" rel="nofollow noreferrer ugc">here</a>.</p><div class="embedExternal embedImage display-large float-none"> <div class="embedExternal-content"> <a class="embedImage-link" href="https://docs.chatvisor.com/img/jsapi07-usecase-user-login/sessionBasedIdEnabled.png" rel="nofollow noreferrer noopener ugc" target="_blank"> <img class="embedImage-img" src="https://docs.chatvisor.com/img/jsapi07-usecase-user-login/sessionBasedIdEnabled.png" alt="alt-text" height="180" width="320" loading="lazy" data-display-size="large" data-float="none"></img></a> </div> </div> <p></p><p><br></p><h2 data-id="2.-add-tagging-code-to-application">2. Add tagging code to application</h2><p>On a page where the user is signed-in, add a <a href="https://docs.chatvisor.com/docs/jsapi05-user#user-tagging" rel="nofollow noreferrer ugc">call to the tagging method</a> with user data available from your application. This adds user information to an existing browser session.</p><pre class="code codeBlock" spellcheck="false" tabindex="0">CV.user.tag({ "email": "john.doe@chatvisor.com", "firstname": "John", "lastname": "Doe", "labels": [] }) </pre><p>In your logout function, include a call like this in order to reset the user session. This removes the current chat history from their chat window and treats the user as a new customer from then on.</p><pre class="code codeBlock" spellcheck="false" tabindex="0">CV.user.reset(); </pre><p>If you want to assign a customer to a specific agent, you can include the assignedUser property like this:</p><pre class="code codeBlock" spellcheck="false" tabindex="0">CV.user.tag({ "email": "john.doe@chatvisor.com", "firstname": "John", "lastname": "Doe", "assignedUser": "agent1@chatvisor.com" "labels": [] }) </pre><h2 data-id="3.-check-results">3. Check results</h2><p>With this setup done, any user who visits the page will always receive a fresh Session ID, and thus will see an empty chat.</p><p>A user who logs in will automatically have their chat history retreived and visible in the chat window.</p><p>A user who logs out will not see their chat history anymore and instead be treated as a new customer.</p> </article> </main>
