获取音频源网址状态 JS

Question

我正在从Soundcloud API向我的播放器流式传输音频。

<audio></aidio>
<source src="soundcloud-track-url"></source>

我有用于<audio>和<source>标签的错误事件侦听器。

如果流没有加载（从源标签），它会触发onerror，但我不知道如何验证这是因为已经达到了每天的限制。

所以我的逻辑：if我在 src 加载时遇到错误，我想进一步拆分，if这是因为"限制"——这样做，if不是因为"限制"——这样做。

如果达到每日限制，Soundcloud API 将返回 HTTP 429 响应代码"请求过多"。

如何利用"HTTP 429"信息获得预期结果？

Answer 1

您需要将

event 等属性传递给错误处理程序，然后获取其指向引发错误的 HTML 元素的 target 属性。

一旦你有了元素本身，就很容易使用 .getAttribute('src') 获取它的 src 属性。

获得 src 属性后，可以fetch该属性并检查该请求的错误状态。

document.getElementById("mySource").onerror = event => {
    var sourceElement = event.target;
    var audioURL = sourceElement.getAttribute("src");
    fetch(audioURL).then(function(response) {
        alert(response.status);
    });
};

以下是关于其工作原理的沙盒：

https://codepen.io/pghiran/pen/GzWdmg?editors=1010

Answer 2

由于您在问题中没有提供任何线索，我只是猜测您正在使用 AJAX 与 SoundCloud 进行通信。

鉴于此，您需要检查xhr（XMLHttpRequest）对象上的status属性。

xhr.onreadystatechange = function( e ) {
    // `xhr.status` is what you're looking for.
    // you can check if it matches your expected 429 or not 
    if ( xhr.status == 429 && xhr.readyState == 4 ) {
        // do whatever you want
    }
}

更新：由于一开始使用了错误的方法，我建议您阅读人们遇到的相同问题，看看他们是如何解决的。