Dijeli putem

Prilagodba widgeta za chat uživo za mobilne aplikacije

Imate dvije mogućnosti za integraciju poruka u izvornu mobilnu aplikaciju:

  • Koristite izvorne komplete za razvoj mobilnog softvera (SDK) za iOS i Android
  • Korištenje web-widgeta unutar web-prikaza WebView

Preporučujemo da koristite nativne SDK-ove za mobilne uređaje jer pružaju vrhunsku podršku za značajke i performanse.

Integracija s mobilnim SDK-ovima kontaktnog centra sustava Dynamics 365

SDK-ovi za mobilne uređaje i njihova dokumentacija nalaze se na GitHubu:

SDK-ovi sadržavaju:

  • Primjer aplikacije koja će vam pomoći da započnete
  • Konfigurabilno sučelje za razmjenu poruka
  • Cijeli skup funkcija životnog ciklusa razmjene poruka za integraciju prilagođenog korisničkog sučelja za razmjenu poruka, po želji
  • Podrška za push obavijesti uz Azure Notification Hub

Preporučujemo da koristite provjerenu, trajnu provjeru čavrljanja sa SDK-ovima za razmjenu poruka. To pruža najbolje korisničko iskustvo za obrasce korištenja mobilnih uređaja.

Napomena

Gotovo-of-the-box sučelje vizualno je stilizirano putem koda u vašoj aplikaciji umjesto putem centra za administratore.

Renderirajte widget za chat uživo pomoću ugrađenog koda

Ako SDK-ovi za mobilne poruke ne zadovoljavaju vaše zahtjeve ili vremenske okvire, možete ugraditi web-widget u mobilnu aplikaciju. Međutim, ugrađivanje koda widgeta za chat ima mnoga ograničenja kao što su smanjene performanse, ograničena mobilna upotrebljivost i nedostupne značajke.

A WebView je ugrađeni preglednik koji izvornoj aplikaciji omogućuje prikaz web sadržaja. Upotrijebite komponentu WebView jezika svog mobilnog operativnog sustava kako biste omogućili renderiranje web verzije widgeta za chat na mobilnim uređajima. Mogućnost WebView nudi se na Androidu i iOS-u.

Sljedeći primjer koda prikazuje widget za chat u mobilnoj aplikaciji.

var html: String = """
        <html>
            <head>
                <meta http-equiv="no-cache">
                <meta http-equiv="Expires" content="-1">
                <meta http-equiv="Cache-Control" content="no-cache">
                <script 
                    type="text/javascript"
                    src = "Use src from widget code snippet"
                    id = Microsoft_Omnichannel_LCWidget
                    data-app-id = "Use data-app-Id from widget code snippet"
                    data-org-id = "Use data-org-Id from widget code snippet"
                    data-org-url = "Use data-org-url from widget code snippet"
                    data-render-mobile = "true"
                    data-hide-chat-button = "true"
                    data-color-override = "desired color code eg. #008577">
                </script>
            </head>
            <body>
            </body>
        </html>
    """.trimIndent()
    var baseUrl: String = "Get baseUrl from data-org-url eg. https://oc-cdn-ocprod.azureedge.net"
    chatWebView.loadDataWithBaseURL(baseUrl,html, "text/html", null, baseUrl)

Widget za chat koristi lokalnu pohranu za upravljanje svojim stanjem. Da bi widget za chat pristupio lokalnoj pohrani na Androidu, morate konfigurirati dopuštenje u izvornom kodu.

chatWebView = findViewById(R.id.webview)
webSettings = webView.getSettings();
webSettings.setDomStorageEnabled(true);

Možete optimizirati renderiranje widgeta za chat za mobilno web-iskustvo pomoću podatkovnih oznaka kao što su data-hide-chat-button i data-render-mobile, zajedno s nekoliko API-ja i događaja koje pruža SDK klijenta widgeta za chat uživo. Dodatne informacije: Prilagodba widgeta za chat pomoću podatkovnih oznaka

Da biste otvorili sesiju chata, možete pozvati metodu startChat kada je odabran novi gumb za chat.

chatWebView.evaluateJavascript(
    "Microsoft.Omnichannel.LiveChatWidget.SDK.closeChat();",
    null
)

Podatkovnu oznaku data-render-mobile možete koristiti za optimizaciju renderiranja widgeta za chat uživo na mobilnom uređaju. Na primjer, skriva zaglavlje widgeta za chat. Zajedno sa zaglavljem, nestaje i gumb Zatvori (X). Da biste zatvorili chat, morate stvoriti gumb "završi chat" u mobilnoj aplikaciji i pozvati closeChat metodu na događaju klika.

chatWebView.evaluateJavascript(
    "Microsoft.Omnichannel.LiveChatWidget.SDK.closeChat();", null)

Prethodni kod pokriva scenarij u kojem korisnik mobilne aplikacije završava chat. Međutim, u drugom scenariju, gdje agent završava razgovor, možete osluškivati događaj lcw:threadUpdate i pozvati metodu closeChat da biste završili razgovor sa strane klijenta, kao što je prikazano u sljedećem kodu.

chatWebView.evaluateJavascript(
    "window.addEventListener(\"lcw:threadUpdate\", function(){Microsoft.Omnichannel.LiveChatWidget.SDK.closeChat();})", null)

Kada se chat zatvori, widget za chat uživo pokreće događaj lcw:closeChat . Možete poslušati ovaj događaj i po potrebi izvršiti sve korake nakon chata.

Napomena

Značajke widgeta za chat uživo kao što su eskalacija na glas i video te preuzimanje transkripta chata nisu podržane putem webprikaza.

Referenca SDK-a za chat uživo
Razvijte prilagođene widgete za chat uživo
početakChat
zatvoriČavrljanje
lcw:chatPreuzeto
lcw:chatQueued
Prilagodba widgeta za chat uživo pomoću podatkovnih oznaka

  • Last updated on