Skip to contentSkip to navigationSkip to topbar
On this page

Cookies and the Web Storage API (Webchat 2.0)


(information)

Info

This guide is for Flex UI 1.x.x and channels that use Programmable Chat and Proxy. If you are using Flex UI 2.x.x or you are starting out, we recommend that you build with Webchat 3.x.x.

Flex Webchat 2.0 persists some client-side data to create a better user experience. This can cause some issues when your customers have the Web Storage API disabled. This page discusses cookies, local storage, and session storage, and how Flex Webchat utilizes each one.


Overview

overview page anchor

Flex Webchat utilizes each storage strategy in the following ways:

Cookies

cookies page anchor

Flex Webchat does not use cookies. If your users block the browser from using Cookies, this should not cause any issues.

Used to persist chat after page reload and for error logging. Disabling local storage will cause degraded experience, especially on page reloads, but Webchat should still function.

Required for the proper functioning of Webchat (e.g., opening and maintaining the WebSocket.) Disabling session storage prevents Webchat from functioning.


Storage TypeDefinitionMax SizeExpiration
CookiesStores data that has to be sent back to the server with subsequent XHR requests4KBExpires at a chosen expiration date, or when the session ends in the case of a session cookie
Local StorageStores data in the browser across sessions. Opening two tabs with the same URL will share local storage. Data is never sent to the backendUp to 5 MB of data in the browser in key/value pairsData never expires but can be cleared by the user
Session StorageTemporarily stores data in the browser. Data does not persist across sessions (i.e., two tabs with the same URL will have different session storage.) Data is never sent to the backend.Stores up to 10 MB of data in the browser in key/value pairsData expires when the session ends, e.g., if the browser tab is closed

Information stored in local storage

information-stored-in-local-storage page anchor
Key/nameValueFunctionRequired for functionality of Webchat
twilio-flex-cfObjectKey to the behavior of the UI in persisting state across page reloads. Contains: - ID of the current user - Channel SID -Whether chat window expanded or not - Current state of chat engagement - Whether to ignore previous chat sessions on page refresh - Map of user avatars - JSON Web Token (JWT) for making API callsFor a better UX experience like persisting chat after reloading, yes. Otherwise, no.
loglevel:twilio-flex-webchat-uiEnumFor debugging flex-webchat-ui; determines the level of logs that will be printed to the consoleNo
loglevelEnumFor debugging; determines the level of logs that will be printed to the consoleNo

Information stored in session storage in Webchat

information-stored-in-session-storage-in-webchat page anchor
Key/nameValueFunctionRequired for functionality of Webchat
twilio_twilsock_token_storageBooleanIndicates initialization state of twilsock token storage.Yes
twilio_continuation_token_ip_messagingJWTA Continuation Token from previous connection in JSON Web Token format, allows client to reuse same endpoint-id for messagingYes
<id>::map::<id>.channelsObjectContains uri and id data for sending/fetching channel informationYes
<id>::map::<id>.infoObjectContains uri and id data for sending/fetching channel informationYes
<id>::document::<id>.channelObjectContains uri and id data for sending/fetching channel informationYes
<id>::map::<id>.rosterObjectContains uri and id data for sending/fetching channel informationYes
<id>::list::<id>.messagesObjectContains uri and id data for sending/fetching message informationYes

Need some help?

Terms of service

Copyright © 2024 Twilio Inc.