Javascript 访问HTML5音频响应头

是否有可能以任何方式以Javascript访问HTML5音频源的HTTP响应头（以便我可以读取它们）

<audio id="myaudio" controls>
   <source src="/test.mp3" type="audio/mpeg">
</audio> 

我的service-worker.js看起来像（仅作为示例！）：

---

我的问题是，我无法调试代码（使用Firefox 70），这使测试变得更加困难，我无法创建最终答案…

如果您只想查看标题，请在chrome中加载页面，然后按f12打开开发者工具

所有响应都将位于“网络”选项卡下，单击一个响应，您将看到与之关联的数据（包括http头）

编辑

如果您想在js/jquery中实现这一点，最好的办法是对每个源代码发出ajax请求，然后以这种方式获得响应

例如

let url = $('#myaudio').find('source').first().attr('src');

$.ajax({
    //ajax config with `url` for audio source
})
.done(function(response, textStatus, xhr){
    let headers = xhr.getAllResponseHeaders();
});

---

当你说“访问”。。。你的意思是查看它们吗？@SeanT:是的，我想读取标题（和值）。@Ben可能会尝试

loadeddata

或

loadedmetadata

事件？在您的示例中，

self

是什么？@spoonmiser从文档中可以看出，这些事件无助于获取响应http头。问题是，这是否可以在JS中完成，而不是在一般情况下。@Amy Oh yeah。。。我没看到标签。这可以用ajax来完成，所以我想问一下Javascript。此外，我问的是音频标签源。我不想再次使用ajax请求源代码。@Ben我不知道还有其他方法，音频控件的响应肯定是在javascript在页面上编译之前加载的吗？您可以尝试在js加载事件监听器后动态分配源responses@ben我认为

audio

或

source

标记不允许您将事件处理程序绑定到请求管道；好的，如果您自己提出请求，您只能访问标题。也许可以将此请求的结果绑定到音频源，尽管我对此表示怀疑。

self.addEventListener('fetch', function(event) {
   console.log("SENDING REQUEST: " + event.request.url);
   if(event.request.url === 'https://localhost/test.mp3') {
      event.respondWith(
         fetch(event.request.url, {
            method: "GET",
            headers: {
               "Authorization": "myToken",
            },
            redirect: "follow"
         }).then(function(response) {
            //check for response header here...
            return response;
         })
      );    
    }
 });

let url = $('#myaudio').find('source').first().attr('src');

$.ajax({
    //ajax config with `url` for audio source
})
.done(function(response, textStatus, xhr){
    let headers = xhr.getAllResponseHeaders();
});