Блог

Я пытаюсь использовать плагин «Регионы wavesurfer.js «, но по какой-то причине он не работает. Я уже пробовал разные подходы, которые нашел на некоторых сайтах, однако безрезультатно.
Вот код:

 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 Не было разрешено запускать аудиоконтекст. Он должен быть возобновлен (или создан) после жеста пользователя на странице.

webaudio.js:234 [Устаревание] Код ScriptProcessorNode устарел. Вместо этого используйте AudioWorkletNode.

У вас есть какие-либо идеи относительно того, почему это не работает или что я мог бы сделать, чтобы это сработало?
Заранее благодарю вас!

Я немного опоздал, но у меня была та же ошибка, но я использую плагин микрофона. Вам нужно поставить это перед началом звука:-

 wavesurfer.backend.ac.resume();