Schritt 3: Einbetten der Dashboard-URL - Amazon Quick Suite

Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

Schritt 3: Einbetten der Dashboard-URL

Wichtig

Amazon Quick Sight bietet neue APIs Funktionen zum Einbetten von Analysen: GenerateEmbedUrlForAnonymousUser undGenerateEmbedUrlForRegisteredUser.

Sie können weiterhin das GetDashboardEmbedUrl und verwenden GetSessionEmbedUrl APIs , um Dashboards und die Amazon Quick Sight-Konsole einzubetten, aber sie enthalten nicht die neuesten Einbettungsfunktionen. Aktuelle Informationen zum up-to-date Einbetten finden Sie unter Einbetten von Amazon Quick Sight-Analysen in Ihre Anwendungen.

 Gilt für: Enterprise Edition 
   Zielgruppe: Amazon Quick Suite-Entwickler 

Im folgenden Abschnitt erfahren Sie, wie Sie das Amazon Quick Sight Embedding SDK (JavaScript) verwenden können, um die Dashboard-URL aus Schritt 2 in Ihre Website oder Anwendungsseite einzubetten. Mit dem SDK können Sie folgende Aktionen ausführen:

  • Platzieren des Dashboards auf einer HTML-Seite.

  • Übergeben von Parameter in das Dashboard.

  • Umgang mit Fehlerstatus mit Meldungen, die an Ihre Anwendung angepasst wurden.

Rufen Sie die GetDashboardEmbedUrl-API-Operation auf, um die URL abzurufen, die Sie in Ihre App einbetten können. Diese URL ist für 5 Minuten gültig, die resultierende Sitzung für 10 Stunden. Die API-Operation stellt die URL mit einem auth_code bereit, der eine Single-Sign-On-Sitzung unterstützt.

Es folgt eine Beispielantwort von get-dashboard-embed-url:

//The URL returned is over 900 characters. For this example, we've shortened the string for
//readability and added ellipsis to indicate that it's incomplete.
{
     "Status": "200",
     "EmbedUrl": "https: //dashboards.example.com/embed/620bef10822743fab329fb3751187d2d...",
     "RequestId": "7bee030e-f191-45c4-97fe-d9faf0e03713"
}

Betten Sie dieses Dashboard mithilfe des Amazon Quick Sight Embedding SDK in Ihre Webseite ein oder fügen Sie diese URL zu einem Iframe hinzu. Wenn Sie eine feste Zahl für Höhe und Breite (in Pixeln) festlegen, verwendet Amazon Quick Sight diese und ändert Ihr Erscheinungsbild nicht, wenn sich die Größe Ihres Fensters ändert. Wenn Sie Höhe und Breite in Prozent angeben, bietet Amazon Quick Sight ein responsives Layout, das sich an die Fenstergröße anpasst. Mithilfe des Amazon Quick Sight Embedding SDK können Sie auch Parameter im Dashboard steuern und Rückrufe in Bezug auf den Abschluss des Seitenladevorgangs und Fehler erhalten.

Im folgenden Beispiel wird gezeigt, wie Sie die generierte URL nutzen. Dieser Code befindet sich auf Ihrem App-Server.

<!DOCTYPE html>
<html>

<head>
    <title>Basic Embed</title>
    <!-- You can download the latest QuickSight embedding SDK version from https://www.npmjs.com/package/amazon-quicksight-embedding-sdk -->
    <!-- Or you can do "npm install amazon-quicksight-embedding-sdk", if you use npm for javascript dependencies -->
    <script src="./quicksight-embedding-js-sdk.min.js"></script>
    <script type="text/javascript">
        var dashboard;

        function embedDashboard() {
            var containerDiv = document.getElementById("embeddingContainer");
            var options = {
                // replace this dummy url with the one generated via embedding API
                url: "https://us-east-1.quicksight.aws.amazon.com/sn/dashboards/dashboardId?isauthcode=true&identityprovider=quicksight&code=authcode",  
                container: containerDiv,
                scrolling: "no",
                height: "700px",
                width: "1000px",
                footerPaddingEnabled: true
            };
            dashboard = QuickSightEmbedding.embedDashboard(options);
        }
    </script>
</head>

<body onload="embedDashboard()">
    <div id="embeddingContainer"></div>
</body>

</html>

Damit dieses Beispiel funktioniert, stellen Sie sicher, dass Sie das Amazon Quick Sight Embedding SDK verwenden, um das eingebettete Dashboard auf Ihre Website mit JavaScript zu laden. Führen Sie für den Erhalt dieser Kopie einen der folgenden Schritte aus:

  • Laden Sie das Amazon Quick Sight Embedding SDK von GitHub herunter. Dieses Repository wird von einer Gruppe von Amazon Quick Sight-Entwicklern verwaltet.

  • Laden Sie die neueste Version des QuickSight eingebetteten SDK von https://www.npmjs.com/package/amazon-quicksight-embedding-sdkherunter.

  • Wenn Sie npm for JavaScript dependencies verwenden, laden Sie es herunter und installieren Sie es, indem Sie den folgenden Befehl ausführen.

    npm install amazon-quicksight-embedding-sdk