Přizpůsobení widgetů živého chatu pro mobilní aplikace

Máte dvě možnosti, jak integrovat zasílání zpráv do nativní mobilní aplikace:

  • Použití nativních sad pro vývoj mobilního softwaru (SDK) pro iOS a Android
  • Použití webového widgetu uvnitř webového zobrazení

Důrazně doporučujeme používat nativní mobilní sady SDK, protože poskytují vynikající podporu funkcí a výkon.

Integrace s mobilními sadami SDK kontaktního centra Dynamics 365

Mobilní sady SDK a jejich dokumentace jsou hostovány na GitHubu:

Sady SDK obsahují:

  • Příklad aplikace, která vám pomůže začít
  • Konfigurovatelné rozhraní pro zasílání zpráv ihned po vybalení
  • Kompletní sada funkcí životního cyklu zasílání zpráv pro integraci uživatelského rozhraní pro zasílání zpráv na míru, pokud je to žádoucí
  • Podpora nabízených oznámení pomocí centra oznámení Azure

Doporučujeme používat ověřený, trvalý chat se sadami SDK pro zasílání zpráv. To poskytuje nejlepší zákaznickou zkušenost pro vzorce používání mobilních zařízení.

Poznámka:

Předem připravené rozhraní má vizuální styl prostřednictvím kódu ve vaší aplikaci, nikoli prostřednictvím Centra pro správu.

Vykreslení widgetu živého chatu pomocí vloženého kódu

Pokud sady SDK pro mobilní zasílání zpráv nesplňují vaše požadavky nebo časové osy, můžete do mobilní aplikace vložit webový widget. Vložení kódu chatovacího widgetu má však mnoho omezení, jako je snížený výkon, omezená použitelnost na mobilních zařízeních a nedostupné funkce.

A WebView je vestavěný prohlížeč, který umožňuje nativní aplikaci zobrazovat webový obsah. WebView Pomocí komponenty jazyka operačního systému vašeho mobilního zařízení povolte vykreslování webové verze widgetu chatu na mobilních zařízeních. Funkce WebView je nabízena v systémech Android i iOS.

Následující ukázkový kód vykreslí widget chatu v mobilní aplikaci.

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)

Chatovací widget používá ke správě svého stavu místní úložiště. Aby widget chatu získal přístup k místnímu úložišti v systému Android, musíte nakonfigurovat oprávnění v nativním kódu.

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

Vykreslování widgetu chatu pro mobilní web můžete optimalizovat pomocí datových značek, jako jsou data-hide-chat-button a data-render-mobile, spolu s několika rozhraními API a událostmi poskytovanými klientskou sadou SDK widgetu živého chatu. Další informace: Přizpůsobení widgetu chatu pomocí datových značek

Chcete-li otevřít relaci chatu, můžete zavolat metodu startChat , když je vybráno nové tlačítko chatu.

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

Datovou data-render-mobile značku můžete použít k optimalizaci vykreslování widgetu živého chatu na mobilu. Například skryje záhlaví widgetu chatu. Spolu se záhlavím zmizí také tlačítko Zavřít (X). Chcete-li chat zavřít, musíte v mobilní aplikaci vytvořit tlačítko "ukončit chat" a při události kliknutí zavolat metodu closeChat .

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

Předchozí kód popisuje situaci, kdy uživatel mobilní aplikace ukončí chat. V jiném scénáři, kdy agent ukončí konverzaci, však můžete naslouchat události lcw:threadUpdate a zavolat metodu closeChat k ukončení konverzace ze strany klienta, jak je znázorněno v následujícím kódu.

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

Když je chat zavřený, widget živého chatu spustí událost lcw:closeChat . Tuto událost si můžete poslechnout a v případě potřeby provést jakékoli kroky po chatu.

Poznámka:

Funkce widgetů živého chatu, jako je eskalace na hlas a video a stahování přepisu chatu, nejsou podporovány prostřednictvím webového zobrazení.

Informace o sadě SDK pro živý chat
Vývoj vlastních widgetů pro live chat
StartChat
closeChat
lcw:chatNačteno
lcw:chatQueued
Přizpůsobte si widgety živého chatu pomocí datových značek

  • Last updated on