Langkah 3: Sematkan URL dasbor - Amazon QuickSight

Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

Langkah 3: Sematkan URL dasbor

penting

Amazon QuickSight memiliki API baru untuk menyematkan analitik: GenerateEmbedUrlForAnonymousUser danGenerateEmbedUrlForRegisteredUser.

Anda masih dapat menggunakan GetSessionEmbedUrl API GetDashboardEmbedUrl dan untuk menyematkan dasbor dan QuickSight konsol, tetapi tidak berisi kemampuan penyematan terbaru. Untuk pengalaman up-to-date penyematan terbaru, lihatIkhtisar penyematan.

Di bagian berikut, Anda dapat mengetahui bagaimana Anda dapat menggunakan Amazon QuickSight embedding SDK (JavaScript) untuk menyematkan URL dasbor dari langkah 3 di situs web atau halaman aplikasi Anda. Dengan SDK, Anda dapat melakukan hal berikut:

  • Tempatkan dasbor pada halaman HTML.

  • Masukkan parameter ke dasbor.

  • Menangani status kesalahan dengan pesan yang disesuaikan dengan aplikasi Anda.

Panggil operasi GetDashboardEmbedUrl API untuk mendapatkan URL yang dapat disematkan di aplikasi. URL ini berlaku selama 5 menit, dan sesi yang dihasilkan berlaku selama 10 jam. Operasi API menyediakan URL dengan sebuah auth_code yang memungkinkan sesi masuk tunggal.

Berikut ini menunjukkan contoh respons dariget-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"
}

Sematkan dasbor ini di halaman web Anda dengan menggunakan QuickSight penyematan SDK atau dengan menambahkan URL ini ke dalam iframe. Jika Anda menetapkan nomor tinggi dan lebar tetap (dalam piksel), QuickSight gunakan itu dan tidak mengubah visual Anda saat jendela Anda mengubah ukuran. Jika Anda menetapkan tinggi dan lebar persen relatif, QuickSight berikan tata letak responsif yang dimodifikasi saat ukuran jendela Anda berubah. Dengan menggunakan Amazon QuickSight Embedding SDK, Anda juga dapat mengontrol parameter dalam dasbor dan menerima callback dalam hal penyelesaian dan kesalahan pemuatan halaman.

Contoh berikut menunjukkan cara menggunakan URL yang dihasilkan. Kode ini dibuat di server aplikasi Anda.

<!DOCTYPE html>
<html>

<head>
    <title>Basic Embed</title>

    <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>

Agar contoh ini berfungsi, pastikan untuk menggunakan Amazon QuickSight Embedding SDK untuk memuat dasbor yang disematkan di situs web Anda. JavaScript Untuk mendapatkan salinan Anda, lakukan salah satu hal berikut: