Embedding dashboard


Hi. I’m brand new to Losant so please forgive my total lack of knowledge. I’ve watched most of the videos and I’ve succeeded in creating a few dashboards. However, when I try to embed a dashboard into my page, i get the perpetual wait icon, and the dashboard never shows. I changed it to public, and still no luck. Can someone tell me what I’m missing?
I’m using the sandbox by the way, in case that has something to do with it.



Hi, can you provide us a little more info so we can investigate?

  1. Can you provide a link to the dashboard in question?
  2. When you say you’re trying to “embed a dashboard”, do you mean by this method where you get the JS code to drop into a third-party web page?
  3. If so, can you also provide a link to the page where you are trying to embed the dashboard?
  4. Can you also let us know what web browser you’re seeing this issue in?



Hi. I went to Dashboard Settings and then clicked Embed Dashboard. I’ve included the exact javascript code that was generated below. I’m doing this locally in development, so there is no url for you to link to. After reading your response, I tried several browsers. It seems to work ok in IE 11 and Edge, but not in Chrome, which, of course, is the one I really need it to work with. Here’s the embedded js code:

Begin Losant Embed
Drop this in your markup where you would like the dashboard to go.
<a class="los-widget"
  data-height="451px" data-width="100%"
  View my Losant-powered dashboard "Another Dashboard"
<script>window.lsnt = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0], t = window.lsnt || {};
if (d.getElementById(id)) return t;
js = d.createElement(s); js.id = id;
js.src = "https://app.losant.com/scripts/widgets.js";
fjs.parentNode.insertBefore(js, fjs); t._e = [];
t.ready = function(f) { t._e.push(f); }; return t;
}(document, "script", "lsnt-widgets"));</script>
<!-- End Losant Embed -->

Can you open Chrome’s inspector and see if you are getting any console errors? I can think of a couple possibilities here …

  • Your browser is blocking the cross-origin script that loads the dashboard
  • There is malformed HTML in your page that is causing the script to fail

If you’re getting an error in your console, please paste it here. I’m running the above snippet and the dashboard is displaying fine for me.



Here’s the error I’m getting in Chrome: (I had to change all the https instances to htt because apparently I’m only allowed to include 3 links in a post.)

common-38e345460c172051dc11.js:135 Uncaught DOMException: Failed to read the ‘localStorage’ property from ‘Window’: Access is denied for this document.
at Object. (htt://app.losant.com/common-38e345460c172051dc11.js:135:7610)
at o (htt://app.losant.com/common-38e345460c172051dc11.js:1:410)
at Object. (htt://app.losant.com/common-38e345460c172051dc11.js:117:454845)
at o (htt://app.losant.com/common-38e345460c172051dc11.js:1:410)
at Object.2201 (htt://app.losant.com/main-58c5ea64cd6edc716443.js:1:500418)
at o (htt://app.losant.com/common-38e345460c172051dc11.js:1:410)
at Object.2200 (htt://app.losant.com/main-58c5ea64cd6edc716443.js:1:500308)
at o (htt://app.losant.com/common-38e345460c172051dc11.js:1:410)
at window.webpackJsonp (htt://app.losant.com/common-38e345460c172051dc11.js:1:284)
at htt://app.losant.com/main-58c5ea64cd6edc716443.js:1:1


Are you running a webserver locally (http://localhost) or are you viewing the web page from your file browser (file:///)?

And do you have this setting enabled in Chrome?


Block 3rd party cookies is turned on. I can’t change it, nor will my users be able to change it because of company policy. I’ve been using file:///.




Actually, I’ve tried it with file:/// and
http://localhost . both give same result.


Thanks for the info. I’m able to reproduce the issue you’re talking about and am working on a fix.

We have a release scheduled for early next week, and the fix will go out at that time.