缺少 CORS 400 标头（以及其他问题）

Question

这是我第一个使用 javascript 的项目（基本上来自这里的分叉代码：https://www.kkhaydarov.com/audio-visualizer/）

我正在尝试构建一个可视化工具来响应我托管的音频。

问题： - 抛出 CORS 400 错误（我在源 URL 中使用 https://cors-anywhere.herokuapp.com/http://） - 音频无法识别

这是我在 codepen 上的项目的链接：https://codepen.io/beewash92/project/editor/ZGWOQr 代码也存放在我的github上：https://github.com/beewash/js-audio-visualizer

enter code here

我在 stackoverflow 和网络上搜索了其他帖子，但仍然遇到问题。感谢您的帮助！

Answer 1

如果您尝试在 chrome 中浏览链接，您将收到如下消息

Missing required request header. Must specify one of: origin,x-requested-with

您需要按上述定义自定义请求标头才能使其正常工作。请参考 apihere，因为它清楚地说明了您应该事先做什么。

您应该创建一个带有如下标头的请求

fetch('https://cors-anywhere.herokuapp.com/http://soundcloud.com/gentttry/10999-1', {
    'headers': {
        'Origin': 'soundcloud.com'
    }
})
.then(res=>res.blob())
.then(blob=>URL.createObjectURL(blob))
.then(audio_src=>{
    // Then init your audio here and assign the url
})