wavesurfer.js 的 Regions 插件根本不工作

Question

我正在尝试使用来自 wavesurfer.js 的 Regions 插件，但由于某种原因它无法正常工作。我已经尝试了在某些网站上找到的不同方法，但没有结果。
代码如下：

const initializeWavesurfer = () => {
    return WaveSurfer.create({
        container: "#waveform",
        responsive: true,
        height: 80,
        waveColor: "indigo",
        progressColor: "purple"
})
}

const wavesurfer = initializeWavesurfer();

var RegionsPlugin = window.WaveSurfer.regions;

wavesurfer.addPlugin(RegionsPlugin.create({
    regionsMinLength: 2,
    regions: [
        {
            start: 1,
            end: 3,
            loop: false,
            color: 'hsla(400, 100%, 30%, 0.5)'
        }, {
            start: 5,
            end: 7,
            loop: false,
            color: 'hsla(200, 50%, 70%, 0.4)',
            minLength: 1,
            drag:true
        }
    ],
    dragSelection: {
        slop: 5
    }
})).initPlugin('regions');

wavesurfer.js 和 waversufer.regions.js 标记位于 head 中的 HTML 文件中，如下所示：

<script src="https://unpkg.com/wavesurfer.js@5.2.0/dist/wavesurfer.js"></script>
<script src="https://unpkg.com/wavesurfer.js/dist/plugin/wavesurfer.regions.js"></script>

当我尝试运行它时，我在浏览器中收到以下 2 个警告：

webaudio.js:76 AudioContext 不允许启动。它必须在页面上的用户手势之后恢复（或创建）。

webaudio.js:234 [弃用] ScriptProcessorNode 已弃用。请改用 AudioWorkletNode。

您对为什么这不起作用或我可以做些什么来使它起作用有什么想法吗？
提前谢谢！

Answer 1

我有点晚了，但我遇到了同样的错误，但我正在使用麦克风插件。 你需要把它放在音频开始之前：-

wavesurfer.backend.ac.resume();