`AudioContext (). AudioWorklet.addModule ()`, как загрузить с помощью Blob? - PullRequest
Новая
       21

`AudioContext (). AudioWorklet.addModule ()`, как загрузить с помощью Blob?

0 голосов
/ 29 марта 2019

Я пытаюсь использовать new AudioContext(). audioWorklet.addModule(URL.createObjectURL(blob)) Загрузить, но консоль выдает ошибку: перекрестный источник, если это протокол file://, как использовать audioWorklet?

Я пытался использовать new Blob([Source Code], {type: 'application/javascript'});, но все равно выдает ошибку

Однако в Chrome можно использовать метод file:// протокол new Worker(URL.createObjectURL(blob)). 

const getMp3=()=>{
    // return arrayBuffer
};

const playWorkletStr = async () => {
    let audioContext = new AudioContext();
    let audioBuffer = await audioContext.decodeAudioData(getMp3());

    let bypass = `class Bypass extends AudioWorkletProcessor {
                    process(inputs, outputs) {
                        const input = inputs[0];
                        const output = outputs[0];

                        for (let channel = 0; channel < output.length; ++channel) {
                            output[channel].set(input[channel]);
                        }
                        return true;
                    }
                }
                registerProcessor('bypass', Bypass);
                `;
    let blob = new Blob([bypass], {type: 'application/javascript'});

    await audioContext.audioWorklet.addModule(URL.createObjectURL(blob));
    const bypasser = new AudioWorkletNode(audioContext, 'bypass');

    let source = audioContext.createBufferSource();
    source.buffer = audioBuffer;
    source.connect(bypasser).connect(audioContext.destination);
    source.start();
};
document.getElementById('btn').onclick = () => {
    playWorkletStr();
};

<button id="btn">play</button>
<script src="index.js"></script>

1 Ответ

0 голосов
/ 29 марта 2019

file:// протокол считается перекрестным источником в Chrome.Это означает, что BLOB-идентификаторы URI также будут считаться перекрестными источниками из этого протокола, и ваш рабочий лист откажется компилировать из сценариев перекрестных источников.

Во избежание этого лучше всего запустить локальный сервер на вашем компьютере.,Если вы собираетесь заняться веб-разработкой, это просто необходимо, и установка займет всего несколько минут в зависимости от вашей ОС.

Теперь, если вы действительно хотите использовать протокол file://, тогда вы можетепопробуйте запустить свой хром с флагом --allow-file-access-from-files.

...