我一直在开发一个允许用户单击并操作 mp3 文件的在线应用程序,我正在尝试将本地文件从我的计算机加载到 wavesurfer 对象中,但我在 chrome 中不断收到此错误:
“CORS 策略已阻止从源“null”访问 'file:///local/file/path/to/audio/files/some.mp3' 处的 XMLHttpRequest:跨源请求仅支持协议方案:http ,数据,铬,铬扩展,https。”
我尝试将 HTML 和 mp3 文件放在多台计算机上的多个不同文件夹中,但似乎没有任何效果。这是我的代码:
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wavesurfer.js/1.2.3/wavesurfer.min.js"></script>
<div id="waveform"></div>
<script>
var wavesurfer = WaveSurfer.create({
container: '#waveform',
waveColor: 'darkorange',
progressColor: 'blue',
height: 64,
backend: 'MediaElement'
});
//setRequestHeader('Origin', document.domain);
//wavesurfer.load("http://ia902606.us.archive.org/35/items/shortpoetry_047_librivox/song_cjrg_teasdale_64kb.mp3");
var song = "clippedJaco.mp3";
wavesurfer.load(song);
wavesurfer.on('ready', function () {wavesurfer.play();});
</script>
</body>
添加“MediaElement”后端时,会加载 mp3,但不会生成波形。非常感谢任何帮助,谢谢!