Penyematan Portal Anggota
Sematkan portal anggota loyalitas SocialHub langsung ke situs web Anda sendiri — dengan masuk tunggal. Pengunjung yang masuk melihat poin, kupon, dan tingkatan mereka di dalam iframe, tanpa perlu masuk kedua kalinya.
Backend Anda menandatangani JWT (HS256) berumur pendek yang membawa email pengguna; SDK mengirimkan iframe yang diverifikasi oleh SocialHub dan dihubungkan ke sesi anggota. Sesi menggunakan token bearer (tanpa cookie), sehingga pemblokiran cookie pihak ketiga tidak akan merusaknya.
Cara kerjanya
- 1
Mendaftarkan klien sematan
Di SocialHub, daftarkan klien untuk situs Anda. SocialHub membuat client_id publik dan rahasia bersama satu kali (hanya ditampilkan sekali). Rahasia tersebut hanya tersimpan di backend Anda.
- 2
Tandatangani JWT berumur pendek di backend Anda
Setelah pengguna masuk ke situs Anda, tandatangani JWT HS256 ≤5 menit dengan rahasia bersama, yang membawa email pengguna (iss = client_id). Rahasia tersebut tidak boleh pernah mencapai browser.
- 3
Letakkan skrip SDK di halaman Anda
Tambahkan tag <script> dengan data-token yang diatur ke JWT. SDK membangun iframe, memverifikasi token, menjembatani ke sesi anggota, dan secara otomatis mengubah ukuran frame sesuai dengan kontennya.
Daftarkan klien Anda di aplikasi
Konfigurator penyematan interaktif langsung berjalan di dalam SocialHub — Anda perlu masuk ke tim Anda. Di sana, ia mendaftarkan klien penyematan dan menghasilkan cuplikan yang ditandatangani untuk Anda: client_id Anda dan rahasia bersama satu kali. Rahasia tersebut hanya ditampilkan sekali, jadi simpan segera di backend Anda. Halaman ini adalah referensi statis; konfigurator melakukan pengaturan sebenarnya.
Dari mana client_id dan secret berasal?
Dari konfigurator dalam aplikasi — SocialHub menghasilkan keduanya. Rahasia bersama menandatangani JWT sematan Anda dan terpisah dari kunci REST API Anda dan dari rahasia sesi SocialHub sendiri. Setiap klien memiliki rahasianya sendiri, sehingga kebocoran diisolasi ke satu situs.
Siapkan penyematan di SocialHub1. Jatuhkan SDK di halaman Anda
Tempel cuplikan yang dihasilkan konfigurator — tampilannya seperti ini. Atribut opsional: data-base-url (default https://flash.socialhub.ai), data-min-height (default 600).
<div id="flash-loyalty"></div>
<script src="https://flash.socialhub.ai/sdk/flash-portal.js"
data-token="<JWT signed by your backend>"
data-target="#flash-loyalty"></script>2. Tandatangani JWT di backend Anda
JWT harus ditandatangani di backend Anda — rahasia bersama tidak boleh pernah sampai ke browser. Token berumur pendek dan hanya dapat digunakan sekali.
import jwt from "jsonwebtoken";
const token = jwt.sign(
{
email: user.email,
name: user.name,
marketing_consent: user.optedInMarketing === true,
},
process.env.FLASH_EMBED_SECRET, // your shared_secret
{ algorithm: "HS256", issuer: "<client_id>", expiresIn: "5m" }
);
// Render `token` into the script tag's data-token, or hand it
// to the browser via your own endpoint.use Firebase\JWT\JWT;
$token = JWT::encode([
"iss" => "<client_id>",
"email" => $user->email,
"name" => $user->name,
"marketing_consent" => false,
"iat" => time(),
"exp" => time() + 300,
], $sharedSecret, "HS256");Siap untuk siaran langsung?
Daftarkan klien embed Anda dan ambil client_id asli Anda dan rahasia bersama di konfigurator SocialHub, lalu tempelkan cuplikan yang dihasilkan di atas.