IFrame we ýerli gaplar: haçan saýlamaly
Makalanyň doly teksti
1) Adalgalar we kontekst
iFrame - üçünji tarapyň mazmunyny (oýun, kassa, widget) birleşdirýän HTML konteýner. Host we mazmuny gelip çykyşy syýasaty (same-origin policy) bilen logiki taýdan izolirlenendir.
Native konteýner - WebView (WKWebView, Android WebView) ýa-da native SDK (render, network, tölegler, telemetriýa) bilen çalşyrylan programma/modul.
Nirede duş gelýär: oýunlaryň başlangyjy we demo, lobbi, kassa/onbording, live-video, jekpot widjetler, hyzmatdaş landingler.
2) Gysga jogap: näme saýlamaly
Çalt başlamaly, üçünji tarap mazmuny köp, iň az ösüş → iFrame.
Awtonom/pes gijikdirme/agyr grafika/enjam bilen çuňňur integrasiýa → ýerli konteýner (WebView + bridge ýa-da SDK) gerek.
Bazarlar/storanalitika/berk gollanma (Apple/Google), ulgam tölegleri, gaty RG-haklar → ýerli konteýner.
Media saýtlar, SEO-landingler, playable-goşma synlar → iFrame.
3) Saýlama matrisa (ýönekeýleşdirilen)
4) iFrame: Haçan ajaýyp
Ssenariler: demo oýunlarynyň çalt çykmagy, hyzmatdaş goşundylary, jekpot/reýting widjetleri, playable-blokly lendingler, B2B-agregatorlar.
Plýuslar
Integrasiýa tizligi: bir 'src' + açarlar/parametrler.
Myhmanyň hostdan berk izolýasiýasy (SOP) - syzmak howpy az.
Üpjün edijiniň garaşsyz neşirleri (deploýňyza degmez).
Üpjün edijileriň ýüzlerçesini köpeltmek arzan.
Minuslar
Enjam we milli tölegler bilen çäkli integrasiýa.
Çuňňur telemetriýa has kyn (köprüden uly).
3rd-party cookies/Storage (Safari/Firefox/ITP) bilen baglanyşykly meseleler.
Jübi telefonlarynda çylşyrymly doly ekran/yşaratlar/klawiatura.
Iň oňat amallar
'sandbox' atributlary ('allow-forms', 'allow-scripts' bilen çäklenmeli, 'allow-popups-to-escape-sandbox' -ni açmaly).
"Content-Security-Policy" üpjün edijileriň ak sanawlary bilen; "X-Frame-Options" duýgur sahypalar üçin.
Aragatnaşyk - 'postMessage' 'event' barlagy bilen. origin 'we habar shemasy.
Resize: 'ResizeObserver' + 'postMessage (' height ')' → host 'iframe üýtgedýär. style. height`.
Ammar - Storage Access API/follback; state - URL parametrleri ýa-da parent state arkaly.
RG/AML: durma signallary (öz-özüni aýyrmak, çäkler) - wakalar arkaly iframe sessiýany tamamlamaga borçludyr.
5) Ýerli gaplar: olar ýeňiş gazananda
Ssenariler: live-oýunlar we kassa bilen ykjam programmalar, çylşyrymly onbording/KUS, pes gijikdirme bilen real-time akymlary, oflayn usullar, stor-tölegler, AR/VR-fiçler.
Plýuslar
Öndürijilik/pes gizlinlik, demire elýeterlilik (kamera, biometriýa).
Bitewi UX we RG/AML çuňňur integrasiýasy (ulgamlaýyn alertler, ýerli toplar).
Ygtybarly in-app tölegleri we abunalyklary (StoreKit/Billing).
Takyk telemetriýa we şowsuzlyklara gözegçilik etmek (crashlytics, traces).
Minuslar
Eýeçiligiň bahasy: köp platforma işläp taýýarlamasy, setirler arkaly goýberilmegi.
"Apple/Google" -y tassyklamak; höwesjeňlige/töleglere çäklendirmeler.
Howpsuzlyk we gizlinlik boýunça has köp borçlar.
Patternler
WebView + JS bridge (ikitaraplaýyn kanal): oýun/töleg/çäk wakalary öz-özünden geçýär.
Gibrid: möhüm ekranlar natiw (kassa, KYC, RG), mazmun - WebView/iFrame.
Üpjün edijiniň SDK: oýunlar/akymlar kitaphana tarapyndan birleşdirilýär; host bellikleri, çäkleri, gapjygy berýär.
6) Aragatnaşyk: iFrame ⇄ host we WebView ⇄ nativa
Web (iFrame):- `window. postMessage({type, payload}, targetOrigin)`
- Wakalar shemasy: 'game. session. start/stop`, `bet. place/settle`, `rg. limit. hit`, `jackpot. contribution`, `error`.
- Tassyklamak: 'origin' -ni barlaň, wersiýa giriň ('v1', 'v2').
- iOS: `WKScriptMessageHandler`; Android: 'addJavascriptInterface' (@JavascriptInterface, gereksiz).
- Format birmeňzeş ('type', 'payload', 'trace _ id'), möhüm toparlar üçin HMAC gollary.
7) Howpsuzlyk we gabat gelmek
assetalar üçin CSP, sandbox, SRI; 'allow-top-navigation-by-user-activation' -ni zerursyz öçürmek.
Host bilen mazmunyň arasynda Zero-trust: minimal permishenalar, howply API-ler.
PII/rezidentlik: sebitler boýunça ammar we loglar; sebitleýin haýyşlary gadagan etmek.
RG/AML: stawkada sinhron duralga signallary; WORM girelgesi.
Cookies/ITP: 'SameSite = None; Secure`; для 3rd-party — Storage Access API или server-side session.
8) Öndürijilik we UX
iFrame: ýalta baglanyşyk ('loading = lazy'), tor çeşmeleriniň ileri tutulmagy, 'preconnect' provayder domenlerine.
WebView: gereksiz JS-ni öçürmek, assetleri kesmek, enjamlary çaltlaşdyrmak, GC/ýady arassalamak.
Doly ekran we ugrukdyryş: wakanyň shemasy arkaly berk gürlemek (geçişi haçan we kim başlaýar).
Hatalary gaýtadan işlemek: bitewi kodlar ('NETWORK _ TIMEOUT', 'PAYMENT _ BLOCKED', 'RG _ BLOCK') we UX-prompt.
9) Analitika we A/B
Waka şinasy: 'session. started/ended`, `bet. placed/settled`, `deposit. succeeded`, `rg. limit. hit`, `error`.
Identifikatorlary: 'tenant _ id/brand _ id/region/player _ pseudo', 'trace _ id'.
iFrame-de parent-proxy (hostda tag-manager) arkaly trek, WebView-da ýerli SDK analitikleri bar.
A/B: hostdaky fiçflaglar; iFrame 'postMessage (init)' arkaly warianty tanaýar.
10) Tölegleriň goşulmagy
Web/iFrame: has gowusy iFrame-iň içinde däl-de, hostda kassa ýygymy (3rd-party-den az, UX-den gowy, RG/AML-den aňsat).
Kabul ederlikli ssenariler üçin StoreKit/Billing; otherwiseogsam - PSP orkestri güýçli telemetriýa we idempotency bilen ýerli.
11) Saýlamagyň keýs kartasy
Siz müňlerçe oýun we iň az dev-çeşmeleri bolan agregator/media:- → iFrame, berk 'sandbox', 'postMessage' -protokol, kassa/host çäkleri.
- → Milli konteýner: lobbi üçin WebView, milli kassa/KYC/RG, SDK live-provayder.
- → Doly ýerli SDK ýa-da programmada hereketlendiriji.
12) Çek-listler
iFrame integrasiýasy
- 'sandbox' + minimal 'allow' -prawo.
- Ak sanawly CSP; Skriptlar üçin SRI.
- Aýdyň shema 'postMessage' (+ wersiýa + валидация 'origin').
- RG/AML duralgalary goldanýar, sessiýalar dogry tamamlanýar.
- Ammar: ITP/3rd-party cookies üçin meýilnama.
- Telemetriýa: bets/min, settle-lag, error-rate, FPS (zerur bolsa).
Ýerli konteýner
- JS-bridge ak usullaryň sanawy we payload tipifikasiýasy bilen.
- Pul ýollarynda milli kassa/KYC/RG, idempotency.
- Toplar, deep-links, lifecycle-huki.
- Crash/trace, privacy-permishen, PII-e girmegiň barlagy.
- Apple/Google-yň hyjuw we töleg syýasaty berjaý edilýär.
13) Anti-pattern (gyzyl baýdaklar)
Kassany üpjün edijiniň iFrame-e salmak (RG/AML/telemetriýa gözegçiligini ýitirmek).
'event. origin` в `postMessage`.
3rd-party cookies steýtiň ýeke-täk usuly hökmünde.
Birnäçe marka/sebit üçin birmeňzeş açarlar/syrlar.
Web-inspektordan balanslary/çäkleri el bilen düzetmek (serwer barlaglary ýok).
Nol zaýalanmalar: iFrame-iň ýykylmagy graceful-fallback-siz tutuş sahypany döwýär.
14) Netije
iFrame - mazmunyň ekosistemasyna "çalt şlýuz": az çykdajy, berk izolýasiýa, çalt goýberiş. Içerki gaplar - çuňlugy barada: öndürijilik, enjam, stor-tölegler, berk RG/AML we iň ýokary UX. Bir çemeleşme däl-de, bir kombinasiýa ýeňýär: iFrame/web kataloglar we demo üçin, pul, live-tejribe we kadalaşdyryjy berklik üçin. Jogapkärçiligiň zolaklarynyň dogry bölünmegi, wakalaryň anyk şertnamalary we güýçli howpsuzlyk tizlik, töwekgelçilik we hil boýunça eglişiksiz gerim berer.
