Play html audio in wkwebview will report error: Required client entitlement is missing

Question

An error is reported when playing h5 audio or video elements in wkwebview: Error acquiring assertion: <Error Domain=RBSAssertionErrorDomain Code=3 "Required client entitlement is missing" UserInfo={RBSAssertionAttribute=<RBSDomainAttribute| domain:"com.apple.webkit" name:"MediaPlayback" sourceEnvironment:"(null)">, NSLocalizedFailureReason=Required client entitlement is missing}> Then the performance of the webview will become very poor, no response to any element click.This problem has affected our tens of thousands of users.The current solution is to call the client method to play audio.How to solve the problem fundamentally?

1.There is an audio element and a button button in my HTML file. Click the button to play audio.

<body>
        <button onclick="handleClick()">PLAY</button>
        <audio id="audio" src="https://ac-dev.oss-cn-hangzhou.aliyuncs.com/test-2022-music.mp3"></audio>
        <script>
   
            function handleClick() {
                document.getElementById("audio").play();
            }
        </script>
</body>

2.Create a wkwebview to load the html file in my demo APP.

class ViewController: UIViewController , WKUIDelegate{

    var webView: WKWebView!
    override func loadView() {
        let config = WKWebViewConfiguration()
        config.preferences.javaScriptEnabled = true
        config.allowsInlineMediaPlayback = true
        webView = WKWebView(frame: .zero, configuration: config)  //.zero
        webView.uiDelegate = self
        
        view = webView
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        let myURL = URL(string: "https://ac-dev.oss-cn-hangzhou.aliyuncs.com/test-2022-py.html")
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
    }
}

3.Click the button in the HTML to play the audio, and you can see the error report on the xcode.

iPadN[2133:855729] [assertion] Error acquiring assertion: <Error Domain=RBSAssertionErrorDomain Code=3 "Required client entitlement is missing" UserInfo={RBSAssertionAttribute=<RBSDomainAttribute| domain:"com.apple.webkit" name:"MediaPlayback" sourceEnvironment:"(null)">, NSLocalizedFailureReason=Required client entitlement is missing}>

4.To sum up, this error will appear when playing audio or video in HTML. Then the app performance will drop a lot, and the interactive response will be very slow.

Thomas Renger Thomas Renger · Accepted Answer · 2021-07-24T09:16:30

I had a similar issue. My plan was to use new Audio(...) with an asset or a blob stored as object url in the storage. It is working for the asset but was not for the blob stored as string in the storage ... but only on the device, exactly like you mentioned.

I resolved it with the following strategy (for the not working part, it is all type script in my case, but can be done directly in java script):

create a ``AudioContext```
create ArrayBuffer from my blob/string using the ``FileReader```
decode the audio data (await context.decodeAudioData(arrayBuffer, (buffer) => {...}))
play the sound on the destination of the audio context:

const source = context.createBufferSource();
source.buffer = buffer;
source.connect(context.destination);
source.start(0)

clean up the stuff on end, if needed

source.onended = async(): Promise<void> => {
 source.disconnect();
 await context.close();
}

Play html audio in wkwebview will report error: Required client entitlement is missing

1 Answers