Embedded Analytics - FAQs

I cannot embed Holistics within my localhost site

Symptoms: You are trying to embed a Holistics dashboard in your localhost, but receive the following error

• Chrome: holistics.io refused to connect
• Firefox: website will not allow Firefox to display the page reference

Explanation: Holistics has a CSP (Content Security Policy) rule that only allows embedding Holistics dashboards in HTTPS websites. This is to ensure your data security.

Solution: Run your localhost site with HTTPS.
We at Holistics understand that this is a bit of a hassle, so we are working on a better solution to improve your developer experience.

InvalidAuthenticityToken error

Sometimes you'll receive this error: ActionController::InvalidAuthenticityToken

There are 2 reasons

• Make sure your site has https
• Enable 3rd-party cookies in your browsers

Access denied for localStorage

Uncaught SecurityError: Failed to read the 'localStorage' property from 'Window': Access is denied for this document

If you have an issue showing the embed, please check the browser's console log for the error:

1. Please open Chrome settings, type "third" in the search box, click the Content Settings button, and view the fourth item under Cookies.
2. Make sure that the option Block third-party cookies and site data is unchecked.

If this setting is checked, third-party scripts cookies are disallowed and access to localStorage may result in thrown SecurityError exceptions.

I saw a blank page when trying to use the embedded frame on my local PC

Due to our security policy, using HTTPS is enforced to prevent token leakage that might lead to your data leakage. It could be the case that your local environment doesn't set up HTTPS.

To solve this problem, please embed the iframe inside a webpage that is served with HTTPS.

Would the embedded dashboards be mobile-friendly (responsive) when viewed outside of Holistics?

Yes. You can view our release note here: New Feature: Mobile Responsive View

I received an error: "To protect your security, us.holistics.io will not allow Firefox Developer Edition to display the page if another site has embedded it. To see this page, you need to open it in a new window."

Currently, Holistics Embedded Analytics can only be embedded within HTTPS sites to ensure your data security. Therefore, please prepend your address with https:// or open the embedded dashboard in a new window.

Why can't I copy values from my embedded dashboard?

This is the default behavior of Holistics, but you can easily configure the embedding code to allow users to copy from your embedded dashboard.

Since Holistics needs to render the dashboards in your websites, there are some default rules applied to prevent Holistics from taking controls of your websites, and "copying" is one of the rules. These rules are implicitly specified by Web Standards to make the web safer.

To enable copying, you need to add allow="clipboard-read" to the embedded HTML code of the embedded iframe. Considering the example here, the HTML iframe with copying enabled should look like this:

<iframe
  src="https://secure.holistics.io/embed/<%= embed_code %>?_token=<%= token %>"
  style="width: 100%; height: 600px;"
  allow="clipboard-read"
  frameborder="0"
  allowfullscreen
>
</iframe>