如何劫持Android中的twitter嵌入后播放按钮

Question

我正在开展我的业余项目，在网络视图中显示嵌入的推文。一些推文包含视频。在 iOS 上，当我单击蓝色播放按钮时，它会在全屏视频播放器中启动视频。与 Android 上一样，它在推文的嵌入式媒体播放器中运行。

我正在使用自定义 Chrome 客户端来处理全屏视图

class CustomChromeClient(val activity: ComponentActivity) : WebChromeClient() {

    var customView: View? = null

    override fun onHideCustomView() {
        (activity.window.decorView as FrameLayout).removeView(this.customView)
        this.customView = null

    }

    override fun onShowCustomView(paramView: View, paramCustomViewCallback: CustomViewCallback) {
        if (this.customView != null) {
            onHideCustomView()
            return
        }
        this.customView = paramView
        (activity.window.decorView as FrameLayout).addView(this.customView, FrameLayout.LayoutParams(-1, -1))
    }

}

但是只有当我必须在推文的媒体播放器中手动点击全屏模式时，才会出现这种全屏。我真正想做的是当我播放视频时，它应该以全屏视图开始。

Answer 1

也许你可以用 addJavascriptInterface 建立一个到 JS 端的桥梁？

伪代码示例

第 1 步：创建 JavaScript 接口

class WebAppInterface(private val activity: Activity) {
    @JavascriptInterface
    fun onVideoPlay() {
        // Trigger full-screen mode here
    }
}

// In your activity or fragment where WebView is set up
webView.addJavascriptInterface(WebAppInterface(this), "AndroidInterface")

第2步：将JavaScript注入WebView

val jsCode = """
    (function() {
        var videos = document.querySelectorAll('video');
        videos.forEach(function(video) {
            video.addEventListener('play', function() {
                AndroidInterface.onVideoPlay();
            });
        });
    })();
"""

webView.loadUrl("javascript:$jsCode")

第3步：修改CustomChromeClient

class CustomChromeClient(val activity: ComponentActivity) : WebChromeClient() {
    // existing code...

    fun triggerFullScreen() {
        // Implement logic to trigger full-screen mode
        // This might involve mimicking what onShowCustomView does
    }
}

注意事项

• 跨源内容：Twitter 的嵌入内容可能受到跨源脚本保护，因此很难将事件侦听器直接附加到视频播放按钮。
• 动态内容：Twitter 的内容是动态加载的，因此您的 JavaScript 需要考虑脚本运行后可能加载的内容。
• 依赖 Twitter 的实现：如果 Twitter 改变其嵌入内容的工作方式，您的解决方案可能会崩溃。