电子网页视图中的Audio.play()拒绝了NotSupportedError

时间:2018-12-21 16:24:24

标签: javascript electron

我正在运行一个Electron(v2.0.3)项目,该项目在Web视图中执行脚本。脚本之一是在条件下播放本地音频文件。

但是,如果音频播放是在Web视图中调用的,则拒绝播放;如果在index.html中调用,或者如果播放的是在线音频文件而不是本地的音频文件,则可以正常播放。

我已将Web视图的nodeIntegration设置为true,并确保Web视图未被静音。我想这不是自动播放政策的问题,因为如果我将YouTube视频和在线音频(例如http://www.pacdv.com/sounds/ambience_sounds/air_hum.wav)加载到网络视图中,它们的效果就很好。

此外,文件路径和文件本身也没有问题,因为当我直接在index.html内部执行脚本时,它可以很好地工作。

这是我的index.html

<head>
    <script>
        function init() {
            web.addEventListener("dom-ready", () => {
                web.executeJavaScript('<my-script>'); 
            }); 
        }
    </script>
</head>
<body onload="init(); ">
    <webview id="web" src="http://www.google.com" 
        style="width: 800px; height: 600px; "
        webpreferences="nodeIntegration=true"></webview>
</body>

这是<my-script>的内容:

let path = `file://${require("electron").remote.app.getAppPath()}/xxx.mp3`; 
new Audio(path).play().then().catch(ex => {
    document.body.innerHTML = ex; 
}); 

Audio.play()之后,承诺被拒绝并显示错误消息:

NotSupportedError: Failed to load because no supported source was found.

我曾经考虑过跨域限制的可能性,但这似乎不是因为我可以像以前所说的那样播放来自不同域的在线音频文件。

我该如何解决?这可能是错误吗?还是我忘记了一些限制?任何信息,将不胜感激。 谢谢。

编辑:根据我的进一步测试,当我在由executeJavaScript()创建的BrowserWindow.webContents上调用main.js时,也会发生此错误。因此,这似乎是对executeJavaScript的限制,而不是Webview的限制。

docs提到了userGesture限制,可以通过executeJavaScript的第二个参数进行配置。但是,它仍然对我不起作用。

1 个答案:

答案 0 :(得分:0)

在应用启动前添加此行

app.commandLine.appendSwitch('autoplay-policy', 'no-user-gesture-required');