How To Make Oracle Analytics Cloud Embedding Work With Safari Cross-Site Tracking Enabled
Introduction
The Safari browser has built-in protection against cross-site tracking. This can cause an error to occur if this option is enabled and you access a website that includes embedded analytics content. This happens on both desktop and mobile. This blog will explain how to prevent that error occurring.
How to Make It Work
Let’s assume I have a website where I embed a canvas from Oracle Analytics.
https://dataviz-developer.com
I have other blogs that describe the process of embedding, but a key component of the HTML is a reference to the Oracle Analytics instance embedding.js file that looks like this:
<script src=”https://<your-instance-name>.analytics.ocp.oraclecloud.com/dv/ui/api/v1/plugins/embedding/standalone/embedding.js” type=”application/javascript”></script>
The reason the cross-site error occurs is that there are multiple, different domains being used to create the website (i.e. the website domain and the default OAC instance domain). In order to remove the error, a single domain is required throughout the website. This can be achieved using the vanity URL feature of Oracle Analytics Cloud (OAC).
Hosting Website and Subdomain
This blog will assume a basic knowledge of web hosting, in particular SSL certificates and DNS. The first thing that’s needed is a subdomain on the same domain as the website hosting the embedded content. This subdomain is then used as the vanity URL for the OAC instance that is the source of the embedded canvases.
In my example, the domain is:
dataviz-developer.com
and I’ve created a subdomain:
oac.dataviz-developer.com
An SSL certificate is needed for this subdomain as this is required to configure the OAC vanity URL.
Creating an OAC Vanity URL
The process to create a vanity URL has already been blogged about by my colleague and there are details in the OAC product documentation so I won’t re-cap those details in this blog, but, in summary, you manage the vanity URL from the OAC area in the Oracle Cloud Console.
It’s a requirement to use an SSL certificate when defining the vanity URL.
You’ll also need the IP address for the OAC instance and can obtain this from the ‘Additional Details’ tab as shown below.
DNS Configuration
Now you’ve got a subdomain, created a vanity URL for OAC and have the OAC instance IP address, the next step is to map the subdomain to the OAC IP address. This involves creating an A record in the DNS Zone configuration where the domain is registered. This procedure is widely documented and is often described by hosting providers who offer DNS registration.
OAC Safe Domains
Make sure that all the domains and subdomains that are in use are entered into the OAC safe domains page in the OAC console. If you are also using OCI functions and gateway services for public access via auth tokens, then the gateway services also require entries for CORS / safe domains.
HTML for embedding
Now you’ve got the OAC instance accessible via a vanity URL and your subdomain targeting the OAC instance IP address, you can make sure that the link used to reference the embedding.js file uses the vanity URL. You can check this link in the developer tab of the project you’re embedding. Note that you should access the OAC instance using the vanity URL.
Summary
In summary, it’s possible to ensure a website with embedded analytics from Oracle Analytics Cloud (OAC) works on Safari browsers with cross site tracking prevention enabled through the use of vanity URLs for OAC.
Acknowledgements
Thanks to my colleagues Matt, Arun, Matthew and Dayne for advice and guidance with this configuration.
