安卓中 FrontApp LiveChat 隐藏 WebView 疑难杂症指南

Android

2024-03-26 14:05:50

如何在安卓中无缝集成 FrontApp LiveChat

问题概述

集成 FrontApp LiveChat 至安卓应用时，您可能会遇到一个棘手的难题：WebView 无法在关闭聊天会话窗口后隐藏。这可能导致用户界面出现不一致的问题，并且会损害整体用户体验。

解决方案

解决此问题需要遵循以下步骤：

验证指南： 仔细检查 FrontApp 的集成指南，确保您的代码与之完全一致。
自定义 WebViewClient： 创建自定义 WebViewClient，并覆盖其 shouldOverrideUrlLoading 方法。
隐藏 WebView： 在 shouldOverrideUrlLoading 方法中，隐藏 WebView 并显示一个重新打开聊天窗口的按钮。
显示重新打开按钮： 添加一个按钮，在点击后将隐藏自身并显示 WebView，以便用户重新打开聊天窗口。

代码示例

以下代码片段展示了如何实现上述解决方案：

class MainActivity : ComponentActivity() {
    private var fileChooserResultLauncher = createFileChooserResultLauncher()
    private var fileChooserValueCallback: ValueCallback<Array<Uri>>? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        CookieManager.getInstance().setAcceptCookie(true)
        CookieManager.getInstance().removeAllCookies(null)
        WebStorage.getInstance().deleteAllData()
        val webView = findViewById<View>(R.id.web) as WebView

        webView.settings.javaScriptEnabled = true
        webView.settings.domStorageEnabled = true
        webView.settings.allowContentAccess = true
        webView.settings.allowFileAccess = true

        webView.webChromeClient = object : WebChromeClient() {
            override fun onShowFileChooser(
                webView: WebView?,
                filePathCallback: ValueCallback<Array<Uri>>?,
                fileChooserParams: FileChooserParams?
            ): Boolean {
                try {
                    fileChooserValueCallback = filePathCallback
                    fileChooserResultLauncher.launch(fileChooserParams?.createIntent())
                } catch (e: ActivityNotFoundException) {
                    e.printStackTrace()
                }
                return true
            }
        }

        val autoOpen =
            "<html>"+
                    "<body>" +
                    "<script src=\"https://chat.frontapp.com/v1/chat.bundle.js\"></script>" +
                    "<script>" +
                    "window.FrontChat('init', {chatId: 'ce4c58cd0f7cbcd3ed3eaf3b0b09XXXX', useDefaultLauncher: false, shouldMobileReloadOnClose: true})" +
                    "</script>" +
                    "<script>" +
                    "setTimeout(() => window.FrontChat('show'), 2000)" +
                    "</script>" +
                    "</body>" +
                    "</html>"

        webView.visibility = View.INVISIBLE

        webView.loadDataWithBaseURL("http://localhost/", autoOpen, "text/html", "UTF-8", null)

        val openChatButton: Button = findViewById<View>(R.id.button) as Button

        webView.webViewClient = object : WebViewClient() {
            override fun shouldOverrideUrlLoading(view: WebView, url: String): Boolean {
                if (url == "https://chat.frontapp.com/close") {
                    webView.visibility = View.INVISIBLE
                    openChatButton.visibility = View.VISIBLE
                    return true
                }
                return false
            }
        }

        openChatButton.setOnClickListener {
            openChatButton.visibility = View.INVISIBLE
            webView.visibility = View.VISIBLE
        }
    }

    private fun createFileChooserResultLauncher(): ActivityResultLauncher<Intent> {
        return registerForActivityResult(ActivityResultContracts.StartActivityForResult()) {
            if (it.resultCode == Activity.RESULT_OK) {
                fileChooserValueCallback?.onReceiveValue(arrayOf(Uri.parse(it?.data?.dataString)))
            } else {
                fileChooserValueCallback?.onReceiveValue(null)
            }
        }
    }
}