embedding-api-v3-guide
embedding-api-v3-guide copied to clipboard
tableau
Get Notification When the Viz failed to load
The current version of the JS API offers the possibility to get a notification when the Viz object is ready (https://help.tableau.com/current/api/js_api/en-us/JavaScriptAPI/js_api_concepts_initializing.htm#get-notification-when-the-viz-object-is-ready) but there is not reliable way to have such notification when the Viz fails to load.
This can happen for a number of reasons (connectivity issue with the Tableau instance, Viz URL that changed, ...) and we'd like to be able to set up an asynchronous callback that would be called when the Viz fails to load to display an error message to the user instead of the blank screen that happens in this case.
We're currently using the workaround explained in the last answer of this post: https://community.tableau.com/s/question/0D54T00000CWejqSAD/javascript-api-catching-errors but we'd like a more practical/reliable option (like the "onFirstInteractive" event).
We performed a few tests and unfortunately, the workaround is no longer working in the embedding API v3: we would greatly benefit from having a "Viz failed to load" notification like the "onFirstInteractive" event!
On this subject, would it be possible to include the error code in the "Viz failed to load" event ?
This would prevent us from having to scrape the HTML DOM to retrieve the error code displayed to users:
Thanks !
is there any effort on adding this feature? It will be so helpful. We had issues in the past with V2, and now that we're migrating to v3, it's a bit discouraging to see that v3 is carrying a known issue from the previous version.
We performed a few tests and unfortunately, the workaround is no longer working in the embedding API v3: we would greatly benefit from having a "Viz failed to load" notification like the "onFirstInteractive" event!
On this subject, would it be possible to include the error code in the "Viz failed to load" event ? This would prevent us from having to scrape the HTML DOM to retrieve the error code displayed to users:
Thanks !
@florent-guinard @illonage How you are able to scrape the dom of iFrame, does browser cross-origin policy allow you to do that ?
Is there any setting to configure in Tableau Server ? Please share
@hackwithharsha We're not yet doing that. This is what we were planning to try if the "Viz failed to load" event is implemented without the error code but I'm not certain that this will be technically feasible.
Today, the best way to go about it is to use onFirstInteractive. We are currently working on prioritizing the work on our backlog but for that we need to prioritize the scenarios of failure. The main one that we are prioritizing is Connected Apps failure scenarios. Let us know what failure scenarios you are facing.
@illonage I want to handle connected Apps Error codes. Instead of black screens that were showing to users. In development mode, it's ok to show black screen.. not in production mode though !!
@illonage There are three main failure scenarios we're facing:
- Connectivity issue between the Tableau Server site and the web server hosting the application that embeds Viz.
- Invalid URL: we're embedding a Viz whose URL changes (it gets deleted and then re-published with a different URL for example)
- Connected App errors: the secret is deleted, the connected app is disabled, ...
Our interest is both in:
- having an event that is called when the Viz failed to load - we want to be reliable when displaying errors to users, and the current solution of waiting for the "onFirstInteractive" event to be triggered with a timeout is neither reactive (we have to wait the full timeout) nor reliable (if the timeout is too low an error would be displayed for a Viz that takes a long time to load but it still working properly)
- having the exact error message to display accurate information to our users - a connected app error code or a 404 requires different actions from the user and iframes makes it very difficult for us to retrieve the information in the HTML page
Thanks @hackwithharsha @florent-guinard ! We are currently prioritizing Connected Apps failures. I will let you know when we have a developer preview.
@hackwithharsha I am happy to announce that the prerelease of the Embedding API v3.6 if now available: https://embedding.tableauusercontent.com/preview/getting-started-v3.html
@hackwithharsha I am happy to announce that the prerelease of the Embedding API v3.6 if now available: https://embedding.tableauusercontent.com/preview/getting-started-v3.html
Great.. I will check
@ewaldhofman-sf @illonage we are also very interested in being able to handle Viz errors. Unfortunately trying your developer preview version (we are currently on v3.1.0), we are faced with the following CORS error in browser:
Access to fetch at 'https://prod-apsoutheast-a.online.tableau.com/vizportal/api/web/v1/auth/embed/signin' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
http://localhost:3000 is in our domain allowlist.
I have noticed that v3.1.0 does not make a call to the /signin path.
Where to from here?
UPDATE:
I've since run chrome with web security disabled (google-chrome --user-data-dir="~/chrome-dev-disabled-security" --disable-web-security --disable-site-isolation-trials) and now I get this error:
The version of the Embedding library is not compatible with the version of Tableau. The visualization will load, but the Embedding API methods and events are not available.
This error seems strange as we are on Tableau Cloud and so I assumed we would be on the latest version of Tableau.
@ACronje Are you using the developer sandbox for testing the dev preview? It is now available on all pod with 23.2 release, do you mind retrying?