Üye Portalı Yerleştirme
SocialHub sadakat üye portalını tek oturum açma özelliğiyle doğrudan kendi web sitenize entegre edin. Giriş yapmış ziyaretçiler, ikinci bir giriş yapmaya gerek kalmadan puanlarını, kuponlarını ve kademelerini bir iframe içinde görürler.
Arka uç sisteminiz, kullanıcının e-posta adresini taşıyan kısa ömürlü bir JWT (HS256) imzalar; SDK, SocialHub'ın doğruladığı ve üye oturumuna köprü kurduğu bir iframe bırakır. Oturumlar, taşıyıcı belirteç (çerez yok) kullanır, bu nedenle üçüncü taraf çerez engellemesi oturumu bozmaz.
Nasıl çalışır
- 1
Bir yerleştirme istemcisi kaydedin
SocialHub'da siteniz için bir istemci kaydedin. SocialHub, genel bir client_id ve tek seferlik paylaşılan bir sır (yalnızca bir kez gösterilir) basar. Sır yalnızca arka uçta yaşıyor.
- 2
Arka uçta kısa süreli bir JWT imzalayın
Bir kullanıcı sitenizde oturum açtıktan sonra, kullanıcının e-postasını (iss = client_id) taşıyan, paylaşılan sırla ≤5 dakikalık bir HS256 JWT imzalayın. Sır asla tarayıcıya ulaşmamalıdır.
- 3
SDK betiğini sayfanıza bırakın
Veri belirteci JWT'ye ayarlanmış <script> etiketini ekleyin. SDK, iframe'i oluşturur, belirteci doğrular, üye oturumuna köprü kurar ve çerçeveyi içeriğine göre otomatik olarak yeniden boyutlandırır.
Müşterinizi uygulamaya kaydedin
Canlı, etkileşimli yerleştirme yapılandırıcısı SocialHub içinde çalışır; ekibinize giriş yapmanız gerekir. Burada bir gömülü istemci kaydeder ve sizin için imzalı kod parçasını oluşturur: client_id'ınız ve tek kullanımlık paylaşılan bir gizli anahtar. Gizli anahtar yalnızca bir kez görüntülenir, bu nedenle hemen arka uç sisteminize kaydedin. Bu sayfa statik referanstır; yapılandırıcı gerçek kurulumu yapar.
client_id ve secret nereden geliyor?
Uygulama içi yapılandırıcıdan — SocialHub her ikisini de oluşturur. Paylaşılan gizli anahtar, gömülü JWT'lerinizi imzalar ve REST API anahtarlarınızdan ve SocialHub'ın kendi oturum gizli anahtarından ayrıdır. Her istemcinin kendi gizli anahtarı vardır, bu nedenle bir sızıntı tek bir siteyle sınırlıdır.
SocialHub'da yerleştirmeyi ayarlama1. Sayfanıza SDK ekleyin
Yapılandırıcının oluşturduğu kod parçasını yapıştırın — şöyle görünür. İsteğe bağlı özellikler: data-base-url (varsayılan https://flash.socialhub.ai), data-min-height (varsayılan 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. Arka uçta JWT'yi imzalayın
JWT, arka uçta imzalanmalıdır — paylaşılan gizli anahtar asla tarayıcıya ulaşmamalıdır. Token'lar kısa ömürlü ve tek kullanımlıktır.
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");Canlı yayına geçmeye hazır mısınız?
Gömülü istemcinizi kaydedin ve SocialHub yapılandırıcısında gerçek client_id ve paylaşılan gizli anahtarınızı alın, ardından yukarıda oluşturulan kod parçasını yapıştırın.