Javascript wavesurfer.js赢得'；无法加载本地文件
我一直在开发一个在线应用程序，允许用户点击并操作mp3文件，我正试图将本地文件从我的计算机加载到wavesurfer对象中，但我在chrome中不断遇到这个错误： “在中访问XMLHttpRequest” 'file:///local/file/path/to/audio/files/some.mp3'来自源'null' 已被CORS策略阻止：跨源请求仅限于 支持协议方案：http、数据、chrome、chrome扩展、， https。“ 我曾尝试将HTML和mp3文件放在多台计算机上的多个不同文件夹中，但似乎没有任何效果。这是我的密码：Javascript wavesurfer.js赢得'；无法加载本地文件,javascript,html,audio,wavesurfer.js,Javascript,Html,Audio,Wavesurfer.js,我一直在开发一个在线应用程序，允许用户点击并操作mp3文件，我正试图将本地文件从我的计算机加载到wavesurfer对象中，但我在chrome中不断遇到这个错误： “在中访问XMLHttpRequest” 'file:///local/file/path/to/audio/files/some.mp3'来自源'null' 已被CORS策略阻止：跨源请求仅限于 支持协议方案：http、数据、chrome、chrome扩展、， 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>
var wavesurfer=wavesurfer.create({
容器：“#波形”，
waveColor:“darkorange”，
progressColor:'蓝色'，
身高：64，
后端：“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（歌曲）；
on（'ready'，function（）{wavesurfer.play（）；}）；
添加“MediaElement”后端时，会加载mp3，但不会生成波形。非常感谢您的帮助，谢谢 据我所知，这是因为出于安全原因，浏览器限制从脚本中启动的跨源HTTP请求。这意味着使用XMLHttpRequest和Fetch API的web应用程序只能从加载应用程序的同一来源请求HTTP资源，除非来自另一来源的响应包含正确的CORS头 资料来源： 解决此问题的一种方法是在本地主机中托管web应用程序。您可以使用开始。然后在
index.htmlwavesurfer.js
测试网站
海浪试验