In this article you'll find out how to install Fullview in your web app and understand your users' product experience. Once the installation is complete you'll have access to automatic recordings of their product usage, technical console logs and real-time cobrowsing.
As a prerequisite to use Fullview and all its functionalities, you need to have a Fullview organization and complete the following steps:
Here you can see what Fullview currently supports and does not support.
Not currently supported
Single page web application
Multi-page web application
Angular, React, and others.
Incognito mode or localhost
Production or development environments
Step 1: Install Fullview SDK
Go to the Setup page of your Fullview organization.
Copy the first script and paste it into the
<head>of your web app
The snippet is unique to your org and will install Fullview's SDK in your web app
The SDK is tiny, loads in a 2-step async manner, designed to avoid any load on your side.
Step 2: Integrate with Fullview API (required)
In order to easily find your customers' sessions in Fullview, you need to integrate with Fullview's API. This will allow you to send the identity of your authenticated users into your Fullview organization. Here are the steps:
From the Setup page copy the second script
Paste it into your web app where you have access to the identity of your users
We recommend initializing window.$fvIdentity in the following cases:
on every page running your application where the the user is authenticated
user registers for an account
user signs in
when the user attributes are changing (eg. change of user role)
The data passed in the
$fvIdentity object should contain the following fields:
Anything unique in your organisation that will help you pinpoint your user.
Name of the user. Can be used for filtering.
Email of the user. Can be used for filtering.
Can be used to temporarily disable replays for the current user. This value will be calculated at runtime on every page load, so setting this to true won’t turn off the replay if the page reloads and this field won’t be set anymore.
Environment-based settings and user segmentation
Role-based settings and user segmentation
Multiple fields can be added for your convenience to be displayed in Fullview Dashboard.
Step 3: Whitelist Fullview in your Content Security Policy
script-src-elem https://*.fullview.io https://*.daily.co;
connect-src https://*.fullview.io wss://*.fullview.io https://*.daily.co wss://*.daily.co;
style-src-elem 'unsafe-inline' https://*.fullview.io;
Fullview's SDK also requires the use of a web worker for better performance with the use of UI thread utilization, hence the worker-srcdirective. Read more here about content security policies and web workers. More about web workers and content security policies here.
Have a strict CORS policy?
Fullview needs download access to your stylesheets, images or other assets required to render the page. If you have a strict CORS policy please update it to reflect the enabled access.
Send instructions to your developers
If you need don't have access to your codebase and need help with the installation, you can send the instructions to your developers by inserting their email on the right side of the Setup page.
If you have any questions or feedback, don't hesitate to reach out to us at email@example.com