Question

当 webView 的 WKMediaPlaybackState 的值发生变化时，如何添加一个运行回调的观察者

当 webView 中的 vimeo 视频暂停时，我正在尝试做一些更改

这是我的代码

@IBOutlet weak var vimeoVideoPlayer: WKWebView!

func buildVimeoVideoPlayer(with video: Video) {
    let url = URL(string: "https://player.vimeo.com/video/\(video.id)")!
    let requestObj = URLRequest(url: url)
    vimeoVideoPlayer.load(requestObj)
    vimeoVideoPlayer.contentMode = UIView.ContentMode.scaleAspectFit
    vimeoVideoPlayer.configuration.allowsAirPlayForMediaPlayback = true
    vimeoVideoPlayer.configuration.allowsInlineMediaPlayback = true
    vimeoVideoPlayer.configuration.allowsPictureInPictureMediaPlayback = true
    
    vimeoVideoPlayer.navigationDelegate = self
    vimeoVideoPlayer.scrollView.isScrollEnabled = false

    vimeoVideoPlayer.requestMediaPlaybackState { mediaState in
            switch mediaState {
            case .paused:
                print("the video was Paused")
            case .playing:
                print("the video is playing")
            case .suspended:
                print("the video is suspended")
            default:
                break
            }
    }
}

目前我正在使用 requestMediaPlaybackState 函数，但这只运行一次

Answer 1

您可以直接从 java 脚本观察视频播放器的状态，为此您应该将所需的事件侦听器添加到 video 对象，然后通过 webkit.messageHandlers 将状态发布到本机：

webView.configuration.userContentController.add(self, name: "playbackMessageHandler")

let js = """
    function onPlaybackState(playbackState) {
        const { webkit: { messageHandlers: { playbackMessageHandler } } } = window;
        playbackMessageHandler?.postMessage({ playbackState });
    };

    window.addEventListener('load', (event) => {
        const video = document.querySelector('video');
        video?.addEventListener('play', (event) => onPlaybackState('playing'));
        video?.addEventListener('pause', (event) => onPlaybackState('paused'));
        video?.addEventListener('suspend', (event) => onPlaybackState('suspended'));
    });
"""

let script = WKUserScript(source: js, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
webView.configuration.userContentController.addUserScript(script)

webView.load(...)

...

extension ViewController: WKScriptMessageHandler {
    
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        guard let body = message.body as? [String : String], let playbackState = body["playbackState"] else { return }
        print(playbackState)
    }   
}

如何在 WKMediaPlaybackState 更改时获得通知

1 个答案: