Mulai menggunakan penyematan pribadi

Uji pengetahuan:Halaman ini mengasumsikan bahwa Anda telah memahami dasar-dasar elemen HTML <iframe> Inline Frame, Uniform Resource Locators (URL), dan cookie pihak ketiga. Lihat dokumentasi web MDN di iframe untuk memahami dasar-dasarnya.

Halaman ini akan memandu Anda menyiapkan penyematan pribadi. Opsi penyematan pribadi mengharuskan Anda mengelola elemen HTML <iframe> secara langsung untuk menyematkan konten Looker dan mengharuskan pengguna login ke Looker secara terpisah dari aplikasi host.

Kita akan membahas contoh kode penyematan pribadi ini:

<iframe
    src="https://instance.looker.com/embed/dashboards/4?Timeframe=14+day"
    width="600"
    height="300"
    frameborder="0">
</iframe>

Catatan: Petunjuk berikut berlaku untuk semua konten Looker yang dapat disematkan: dasbor, dasbor LookML, Jelajah, Tampilan, visualisasi kueri, dan ekstensi.

1. Membuat URL konten sematan

Catatan: Halaman ini menjelaskan cara membuat URL konten sematan secara manual. Anda juga dapat membuat URL sematan dari dasbor Looker, Look, atau Explore.

Mari kita lihat contoh konten Looker pada URL https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day. Dari URL konten Looker ini, kita akan membuat URL konten sematan dan menetapkan atribut src iframe ke URL tersebut. Jangan ragu untuk menggunakan URL konten Looker Anda sendiri saat menyelesaikan langkah-langkah berikut.

URL konten sematan dari contoh kode di atas adalah:

https://instance.looker.com/embed/dashboards/4?theme=red&Timeframe=14+day

URL konten sematan terdiri dari tiga bagian:

• Nama host: nama host instance Looker Anda
• Jalur: Jalur URL konten Looker yang diawali dengan /embed (dengan langkah tambahan untuk visualisasi kueri)
• Parameter: Parameter URL yang menentukan filter dan tema

Protokol harus selalu https://. Mari kita bangun setiap bagiannya secara mendetail.

Catatan: Sebagai pintasan, anggap URL konten sematan sebagai URL konten Looker lengkap Anda dengan embed/ yang diawali ke jalurnya (kecuali jika Anda menyematkan visualisasi kueri yang disebutkan di bawah).

Bagian 1: Nama host

1. Buka konten Looker Anda. Mengikuti contoh URL konten Looker: https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day.
2. Nama host URL konten sematan Anda adalah instance.looker.com.

Catatan: Nama host mencakup nomor port, jika ada, misalnya, instance.looker.com:9999.

Bagian 2: Jalur

Jalur URL konten sematan Anda bergantung pada konten Looker yang disematkan.

Menyematkan semua konten Looker, kecuali visualisasi kueri

1. Buka konten Looker Anda. Mengikuti contoh URL konten Looker: https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day
2. Identifikasi jalur URL konten Looker Anda: /dashboards/4.
3. Awali /embed ke jalur URL konten Looker Anda. Jalur URL konten sematan Anda adalah /embed/dashboards/4.

Menyematkan visualisasi kueri

1. Buka visualisasi kueri Anda. Contoh URL: instance.looker.com/explore/my_model/my_explore?qid=1234567890abcdefghij12
2. Identifikasi client ID kueri Anda. Parameter qid: 1234567890abcdefghij12 adalah client ID kueri Anda yang mewakili setelan kueri dan visualisasi.
3. Jalur URL konten sematan Anda /embed/query-visualization/ ditambahkan dengan client ID kueri. Contoh jalur URL konten sematan adalah /embed/query-visualization/1234567890abcdefghij12

Catatan: Anda juga dapat menemukan client ID kueri dengan metode Get Query Looker API sebagai kolom client_id dari objek Query.

Bagian 3: Parameter

Parameter URL konten sematan Anda mengontrol filter dan tema konten yang disematkan.

Filter

1. Buka URL konten Looker Anda.
2. Sesuaikan filter konten secara manual sesuai keinginan Anda. Untuk contoh ini, URL konten Looker yang dihasilkan adalah: https://instance.looker.com/dashboards/4?Timeframe=14+day
3. Parameter URL konten sematan Anda adalah parameter URL konten Looker, misalnya, Timeframe=14+day

Dalam contoh ini, parameter Timeframe=14+day menetapkan nilai filter Timeframe dasbor.

Catatan: Parameter filter tidak membuat filter. Parameter ini harus ada di dasbor terlebih dahulu.

Tema

Lihat panduan penerapan tema untuk membaca cara mengontrol tampilan konten yang disematkan.

2. Menguji URL konten sematan Anda

Buka URL konten sematan di browser untuk melihat pratinjau perilaku dan tampilan konten sematan Anda.

3. Buat iframe

1. Buat elemen iframe di aplikasi host.
2. Setel atribut src ke URL konten sematan Anda.
3. Tentukan atribut width, height, dan lainnya ke atribut yang Anda perlukan untuk menampilkan konten Looker tersemat dengan lebih baik.

4. Mempertimbangkan masalah akses pengguna

Pengguna harus login ke Looker untuk melihat konten Anda yang disematkan. Iframe akan menampilkan halaman error 401 jika pengguna tidak login.

Opsi login pengguna

Pengguna Anda dapat login ke Looker dengan salah satu dari dua cara berikut:

1. Login ke Looker terlebih dahulu

Pengguna harus login ke Looker di browser yang sama sebelum dapat melihat konten sematan.

2. Mengaktifkan layar login Looker sematan opsional

Tambahkan allow_login_screen=true ke parameter URL konten sematan untuk menampilkan layar login Looker di iframe jika pengguna tidak login. Contoh URL konten sematan kami menjadi: https://instance_name.looker.com/embed/dashboards/4?Timeframe=14+day&allow_login_screen=true.

Ingatlah dua hal yang perlu diperhatikan:

• Anda harus menonaktifkan setelan Perlindungan Asal yang Sama untuk Halaman Login Looker guna mengaktifkan layar login Looker di sematan iframe.
• Jika instance Looker Anda mengautentikasi pengguna melalui single sign-on (SSO) dengan penyedia identitas, Penyedia Identitas Anda dapat memblokir layar login dalam iframe Anda. Anda harus menggunakan opsi 1 jika hal ini terjadi.

Kebijakan cookie browser pengguna

Looker menggunakan cookie untuk autentikasi pengguna dan penyimpanan sesi. Browser pengguna Anda harus mengaktifkan cookie pihak ketiga jika pengguna mengakses nama host URL konten sematan instance Looker Anda yang berada di domain yang berbeda dengan aplikasi host Anda.

Beberapa browser, seperti Firefox dan Safari, ditetapkan secara default ke kebijakan cookie yang memblokir cookie pihak ketiga. Jika browser pengguna tidak dapat mengizinkan cookie pihak ketiga, Anda dapat menambahkan domain kustom ke instance Looker agar aplikasi host dan instance hostnameLooker URL konten Anda berada di domain yang sama.

Catatan: Anda dapat melihat daftar cookie yang digunakan Looker di halaman dokumentasi Daftar cookie Looker.

5. Berinteraksi dengan iframe

Mulai dengan Looker menyematkan pesan postingan iframe.

Langkah berikutnya

Mulai dengan penyematan yang ditandatangani menggunakan Embed SDK dan lihat contoh hal yang dapat Anda lakukan dengan penyematan Looker.