Implementing AWS QuickSight Dashboard into Wix Website

Hello, this is my first post and I am new to Wix. I was wondering if anyone could help me to implement a aws quicksight dashboard into a wix webpage.

  1. Embedding url to website automatically
    I currently have:

getDashboardEmbedURL which returns a signed url for quicksight embedding.

When I copy and paste the produced URL into the wix page through “Embed a Site”, it works perfectly fine.

But what I need to do is that when a user first loads the website, the given javascript above has to run after the body loads to produce the url, and this url has to be embeded onto the wix website automatically.

  1. How to import packages
    In node-modules, I have installed aws-sdk, but how would I go about importing this in my javascript above? I currently have:

import { getEmbedURL } from ‘backend/getDashboardEmbedURL.js’;

$w.onReady( function () {
let urlPromise = getEmbedURL();
urlPromise.then( function (url) {
console.log(url);
})
});

Any help would be appreciated, and thanks in advance.

You will find more info about it here from Amazon themselves.
https://aws.amazon.com/sdk-for-node-js/
https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/index.html
https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/QuickSight.html

Or another option, seeing that the embed through Wix iframe works for you, is to just add code so that the html component runs as soon as the page loads so that the website link is displayed after the page loads.
https://support.wix.com/en/article/corvid-working-with-the-html-element
https://www.wix.com/corvid/reference/$w.HtmlComponent.html

How do I know when my HTML component has loaded and is ready for use?
An HTML Component needs to load before you can send it messages using the postMessage() function.

  • Usually an HTML Component finishes loading a short time after the page it is on finishes loading. So if you call postMessage() inside the page’s onReady() event handler, the HTML Component might not be ready yet.

  • To call postMessage() as soon as possible after a page loads, send a message from the HTML Component to the page code as the HTML Component is loaded and then call postMessage() upon receipt of that message.

  • Also, an HTML Component can send messages to the page it is on before the HTML Component itself has loaded completely. For example, this can happen if the HTML Component’s body, or one of its downloaded images, is large. To make sure the HTML component is loaded, send messages only after listening for an onLoad event in the HTML component.

Hi Peter,

Did you make any progress with this? I am hoping to achieve the same as you. Does your use case require user restricted view of data, as in do you require your users to login so that you can restrict the data that is displayed to them?

Hi Ivan. I decided to give up on implementing it directly on Wix and have actually embedded my dashboard in a sub domain of a web domain that I own. I then embedded the website url in an iframe on Wix. It’s more flexible and powerful as it allows you to customise every aspect of your dashboard. Regarding restring user access to information, the information being queried can be defined in your parameters for your ajax call. I’ve used a javascript SDK provided by AWS to implement the dashboard. If you need a working solution, and a code base do let me know.

My apologies in not being much help :).