Mobil uygulamalar: WebView içinde sohbet

Uygulamalar için yerel SDK yoktur. Bunun yerine uygulamanız WebView için özel hazırlanmış sayfayı yükler:

https://reactive.chat/embed/SITE_KEY

Sayfada çerçeve, gezinme veya sohbet düğmesi yoktur; widget ekranı kaplar ve hemen açıktır. Web sitenizle aynı sohbettir: aynı proje, aynı tasarım, aynı gelen kutusu. Site anahtarını hesabınızda Proje → Kurulum altında bulursunuz.

Sayfanın özellikleri:

• yalnızca etkin projeler için; aksi durumda 404,
• viewport-fit=cover ve güvenli alan; giriş alanı alt kenardaki çubuğun üzerinde yer alır,
• widget hazır olana kadar marka renginizde arka plan,
• X-Robots-Tag: noindex ve frame-ancestors 'none'; sayfa başka web sitesindeki <iframe> içine değil, WebView içine yerleştirilir,
• cihaz diline göre dil.

iOS (WKWebView)

import WebKit

let konf = WKWebViewConfiguration()
konf.allowsInlineMediaPlayback = true          // otherwise the full-screen player pulls the chat away

let web = WKWebView(frame: .zero, configuration: konf)
web.scrollView.bounces = false
web.scrollView.contentInsetAdjustmentBehavior = .never
web.load(URLRequest(url: URL(string: "https://reactive.chat/embed/SITE_KEY")!))

WebView öğesini güvenli alan yerleşim kılavuzuna değil, tüm alana yayın; sayfa kenar boşluğunu kendisi hesaba katar.

Android (WebView)

val web = findViewById<WebView>(R.id.chat)
web.settings.javaScriptEnabled = true
web.settings.domStorageEnabled = true            // required: no session without it
web.settings.mediaPlaybackRequiresUserGesture = false
web.webViewClient = WebViewClient()              // otherwise the system browser opens
web.loadUrl("https://reactive.chat/embed/SITE_KEY")

domStorageEnabled isteğe bağlı değildir: widget kimliklerini WebView depolamasında saklar. Olmadan her başlatma yeni sohbet açar.

Oturum açmış kullanıcıyı iletme

Asla adres üzerinden iletmeyin. URL’deki özet geçmişe, günlüklere ve Referer başlıklarına girer. Kimliği yüklemeden sonra JavaScript üzerinden iletin. userHash değerini sunucunuz hesaplar (Ziyaretçileri tanımlama); uygulamalar parçalarına ayrılabildiğinden gizli anahtar uygulama paketinde bulunmamalıdır. Uygulamanız oturum açılırken üç değeri sunucunuzdan alsın.

// Android, in onPageFinished
web.evaluateJavascript(
    """ReactiveChat("identify",{userId:"$id",name:"$name",userHash:"$hash",exp:$exp});""",
    null)

// iOS, in webView(_:didFinish:)
web.evaluateJavaScript(
    "ReactiveChat(\"identify\",{userId:\"\(id)\",name:\"\(name)\",userHash:\"\(hash)\",exp:\(exp)});")

Değerleri JavaScript için doğru kaçışla kodladığınızdan emin olun (en kolayı uygulamanızda JSON olarak serileştirmektir). Daha erken çağrı da çalışır: ReactiveChat.q kuyruğu widget yüklenmeden önce kabul eder.

WebView içinde farklı olanlar

• Anlık bildirimler sohbetten gelmez. Uygulamanız sohbet kapalıyken kullanıcıya ulaşacaksa message.created için webhook kurup anlık bildirimi kendiniz gönderin.
• Dosya yükleme Android’de yalnızca uygulamanız dosya seçiciyi ilettiğinde çalışır (WebChromeClient.onShowFileChooser); iOS bunu kendisi yapar.
• Geri düğmesi (Android): Sayfanın kendi geçmişi yoktur. Sohbeti uygulamanızın bir ekranı gibi ele alın ve web.goBack() çağırmak yerine kapatın.
• Arka plan: Uygulama arka plana geçtiğinde WebView öğesini kaldırmayın. Widget kesintilerden sonra kendisi yeniden bağlanır ve arabellekteki mesajları ardından gönderir (Taşıma).
• Onay: Yerleştirme sayfasında onay platformu yoktur; widget bu nedenle onay olmadan başlar ve başlangıçta kimliklerini yalnızca WebView ömrü boyunca saklar (Gizlilik entegrasyonu). Uygulamanızda, uygulama yeniden başlatıldığında sohbetin devam edip etmediğini kontrol edin.

Olayları uygulamaya aktarma

Widget’ın olaylarını JavaScript köprüsüyle uygulamanıza iletebilirsiniz; örneğin okunmamış mesaj rozeti ayarlamak için:

// Android: register web.addJavascriptInterface(Bruecke(), "App") beforehand
web.evaluateJavascript(
    "ReactiveChat('on','unread',function(e){ App.ungelesen(e.count); });", null)

Sonraki: Smart Answer