IFrame lobby näme we ony nädip birleşdirmeli
iFrame lobby näme
iFrame lobbi - bu mazmun üpjün edijide/agregatorda ýerleşdirilýän we '
Esasy pikir: operator lobbi ýazmaýar, ýöne taýýar, çalt time-to-market, kross-brauzer goldawyny we täzelenmeleri öz tarapynda goýbermezden birikdirýär.
Bu ýerlikli bolanda
Täze üpjün edijini/dikligine çalt başla.
Birnäçe ýurt/markalar üçin bitewi vitrin gerek.
Operatorda frontendiň çäkli buýrugy.
Oňaýly taraplary
Artykmaçlyklary: tizlik, ýeke-täk kod bazasy, täze önümleri awtomatiki ibermek, üpjün edijiniň ylalaşylan seljermesi.
Minuslar: piksel perfektine az gözegçilik, satyjynyň dermanhanasyna garaşlylyk, yzarlamagyň inçeligi, SEO çäklendirmeleri (iframe mazmuny DOM-yň bir bölegi hökmünde indekslenmeýär).
Esasy arhitektura
1. Front (operator): '/casino 'sahypasy'
2. Auth ploter: gysga ömürli 'sessionToken' (JWT/opaque) operatoryň arka tarapynda emele gelýär.
3. Provider lobby: tokeni tassyklaýar, dili/walýutany/çäkleri çalyşýar, oýunlary we bannerleri görkezýär.
4. Messaging tire: 'window. postMessage 'sahypanyň arasynda we wakalar üçin iframe (balans, oýun başlamak, kassa açmak we ş.m.).
5. Cashier/KYC/RG: operator tarapyndan çagyrylýar (iframe däl), ýöne lobbiden toparlar tarapyndan elýeterlidir.
Durmuşa geçirmek üçin iň az talaplar
Awtorizasiýa: gysga ömürli bellikler (1-15 minut) + aç-açan aýlanma (silent refresh).
Howpsuzlyk: CSP, 'sandbox' we iframe üçin takyk 'allow', berk süzgüç 'postMessage'.
Durnuklylyk: wakalaryň şertnamasy (wersiýalar, backward-compat), ýalňyşlyklar ýüze çykan halatynda graceful-fallback.
UX: uýgunlaşdyrylan tor, çalt nawigasiýa, kartoçkalary öňünden ýüklemek, skeleton-ekranlar.
Analitika: bitewi wakalar (impression, click, launch, error), Amplitude/GA4.
Ýerleşdiriş mysaly (HTML + howpsuzlyk)
html
<iframe id="providerLobby"
src="https://lobby. example. com/embed? brand=ACME&lang=ru¤cy=EUR&token={{SESSION_TOKEN}}"
loading="lazy"
referrerpolicy="strict-origin-when-cross-origin"
sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"
allow="fullscreen; autoplay; encrypted-media; clipboard-read; clipboard-write"
style="width:100%;height:100vh; border:0; display:block; ">
</iframe>
Düşündirişler:
- 'sandbox' - Diňe zerur baýdaklary açyň. Gerek bolmasa 'allow-top-navigation' bermäň.
- 'allow' - fiçleri bilkastlaýyn goşuň; 'payment' diňe hakyky ulanylsa.
- 'referrerpolicy' - parametrleriň syzmagyny çäklendirmek.
Content-Security-Policy:
default-src 'self';
frame-src https://lobby. example. com;
script-src 'self' https://lobby. example. com 'unsafe-inline';
img-src 'self' https://lobby. example. com data:;
connect-src 'self' https://api. example. com https://lobby. example. com;
Sahypalaryňyz üçin X-Frame-Options size goşulmagyna päsgel bermeýär → üpjün ediji size goşulýar, tersine däl.
Arka tarapda token öndürmek (Node/Express mysaly)
js import jwt from "jsonwebtoken";
import express from "express";
const app = express();
app. get("/lobby-token", (req, res) => {
const payload = {
sub: req. user. id, brand: "ACME", currency: "EUR", lang: "ru", ts: Date. now()
};
const token = jwt. sign(payload, process. env. LOBBY_JWT_SECRET, {
algorithm: "HS256", expiresIn: "10m", issuer: "acme-casino", audience: "lobby-provider"
});
res. json({ token });
});
Iň oňat amallar: gysga TTL, meýdan barlagy, HSM/Secrets Manager-daky açarlar, "kid" öwrülişigi.
Habar alyşmak: wakalaryň şertnamasy
"PostMessage" -i çeşmäniň whitelisting we shema tassyklamasy bilen ulanyň.
js
//Host (operator)
const iframe = document. getElementById("providerLobby"). contentWindow;
const LOBBY_ORIGIN = "https://lobby. example. com";
window. addEventListener("message", (e) => {
if (e. origin!== LOBBY_ORIGIN) return;
const { type, payload } = e. data {};
switch (type) {
case "lobby:ready":
//iframe başlangyç maglumatlaryny ibereliň. postMessage({ type: "host:context", payload: {
balance: 125. 40, kycStatus: "verified", limits: { betMax: 100 }
}}, LOBBY_ORIGIN);
break;
case "lobby:resize":
document. getElementById("providerLobby"). style. height = payload. height + "px";
break;
case "lobby:openCashier":
openCashier () ;//break funksiýaňyz;
case "lobby:launchGame":
launchGame(payload. gameId) ;//täze penjire/rout break açyp biler;
case "lobby:requestTokenRefresh":
refreshLobbyToken(). then(t =>
iframe. postMessage({ type: "host:newToken", payload: { token: t } }, LOBBY_ORIGIN)
);
break;
}
});
Adaty wakalar (toplumyň mysaly):
- От лобби → хосту: `lobby:ready`, `lobby:resize`, `lobby:openCashier`, `lobby:openRG`, `lobby:launchGame`, `lobby:track`, `lobby:requestTokenRefresh`, `lobby:error`.
- Host → lobbiden: 'host: context' (balans, lokal, çäkler), 'host: newToken', 'host: balanceUpdate', 'host: rgState', 'host: navigation'.
Oýny lobbiden başlamak
Iki çemeleşme:1. Şol iframe içinde - has çalt, ýöne az gözegçilik we yzarlamak has kyn.
2. Aýratyn rut/penjire - metrikadan aňsat, öz overleýleriňizi (RG/çäkleri) asyp bilersiňiz, web-view bilen has gowy gabat gelýär.
Iň az ýol:- Lobbi 'lobby: launchGame {gameId}' iberýär.
- Host 'gameToken' -ni öz bekesinde döredip '/game/: id? token=…`.
- Oýun belligi kabul edýär, tassyklaýar, jedelleriň sessiýalary başlaýar.
UX we öndürijilik
Α daptiw: stolda 3-5 sütün, 2 - planşet, 1 - jübi; kartoçkalaryň beýikligini belläň.
Skeletler we lazy-loading (galereýalar üçin 'loading =' lazy ',' fetchpriority = 'low' şekilleri).
Çalt gözleg we süzgüçler: saýlanan bellikleri '? query '/' localStorage' -de ýatda saklaň.
Kartoçka boýunça basmalar: basyş zolagy ≥ 44px; klawiatura goldawy (A11y).
Bannerleriň pleýsholderleri: leýautyň "bökmezligi" üçin.
iOS media syýasaty: wideo/audio autoplay ulanyjynyň hereketini talap edýär; demoda muny göz öňünde tutuň.
Oýunçynyň laýyklygy we jogapkärçiligi (RG)
Çäklendirmeler we wagtlar: lobbide oýunçynyň häzirki çäklerini görkezmek üçin goldaw (read-only), hostyň tarapynda üýtgetmek görnüşini çagyrmak.
Öz-özüňi aýyrmak: 'lobby: openRG' → iframe-den daşarda RG modulyňyzy açýarys.
Ýur. -bannerler we 18 +: üpjün edijiniň döredijiligine bagly bolmazlyk üçin lobbiniň içinde däl-de, hostyň tarapynda.
GDPR/cookie: lobbi - üçünji tarap, cookie-consent we hukuk bazasyny (contractual necessity/legitimate interest) oýlanyň.
Lokalizasiýa we marka
Dil/walýuta/sebiti 'src' -e we/ýa-da 'host: context' -e geçiriň.
White-label üýtgeýän reňklere, logotiplere, şriftlere rugsat beriň.
Wendor çalşylanda maglumatlary ýitirmezlik üçin "saýlanan/soňky" bloklary operatoryň tarapynda saklaň.
Analitika we metrika
Tracking gatlagy (mysal):- `lobby_impression`, `tile_view`, `tile_click`, `search_use`, `category_change`, `launch_game`, `error_view`.
- TTFB-Bet (lobbä girmekden birinji nyrha çenli wagt), CR_deposit→launch, CTR kategoriýalary/gözleg, Ortaça serediş çuňlugy.
Iframe wakalaryny öz öýüňizde jemläň; üpjün edijiniň pikselleri bilen "goşa hasapdan" gaça duruň.
Giriş synag meýilnamasy
1. Howpsuzlyk: CSP barlagy, artykmaç 'allow' we 'sandbox' baýdaklarynyň ýoklugy, 'postMessage' tassyklamasy. origin`.
2. Sessiýalar: tokeniň gutarmagy, silent-refresh, 401/403-de özüni alyp barşy.
3. Rezise: ykjam/web-view (Android/iOS) dogry beýikligi.
4. Kassa/KUS: lobbi wakalary boýunça modalkalary açmak/ýapmak ssenarileri.
5. Üpjün edijiniň elýeterli däldigi: wagt-autlar, gulplary we retralary görkezmek.
6. RG çäkleri: blokirleme wagtynda oýnuň görkezilmegi we gadagan edilmegi.
7. Lokallary/walýutalary üýtgetmek: uçuşda we täzeden açylanda.
8. Analitika: hasaplaýjylary deňeşdirmek host vs satyjy.
Adaty ýalňyşlyklar (anti-pattern)
'Origin' -i barlamazdan 'message' -listeri asyň.
Iframe doly elýeterliligi beriň ('allow-same-origin allow-top-navigation-by-user-activation' ').
Aýlanmazdan uzak ömürli tokenler.
SEO üçin lobbi mazmunyna bil baglaň.
Oýunçynyň kesşini we üpjün edijiniň katalogynyň kesşini garyşdyrmak (şahsylaşdyrmagy bozýar).
Tracking we RG-overlei gözegçiliksiz şol iframe içindäki oýny başlat.
iFrame lobby integrasiýa barlagy
- Wakalaryň şertnamasy barada ylalaşdyk (wersiýasy, görnüşleri, shemalary).
- TTL ≤ 15 minut we aýlaw bilen/lobby-token.
- CSP, 'sandbox', 'allow', 'referrerpolicy' gurduk.
- Cashier/KYC/RG birikdirildi we 'openCashier '/' openRG' wakalary birikdirildi.
- Üpjün ediji zaýalananda fallback hakda pikir etdik.
- Lokalizasiýany, walýutalary, ýaş bannerlerini deňeşdirdik.
- Analitikany düzdük (user/session ids arkaly).
- Brauzer we ykjam web synaglary geçirildi.
- Wakalaryň runbook we satyjy bilen aragatnaşyk nokatlaryny beýan etdi.
iFrame-lobbi - oýunlaryň katalogyny giňeltmegiň we time-to-market-i gysgaltmagyň çalt we pragmatiki usuly. Sagdyn integrasiýanyň açary - berk howpsuzlyk, wakalaryň anyk şertnamasy, ygtybarly ygtyýarlandyryş we operatoryň tarapynda oýlanyşykly UX/analitika. Muny bir gezek edeniňizde, täze üpjün edijiler bilen integrasiýany "basmak bilen" diýen ýaly giňeldip bilersiňiz.