HTML5音频。替换元素仍然是相同的音频文件（缓存）如何解决？

问题描述

尝试很多方法，我只是无法通过AJAX替换音频文件，它仍然会返回相同的audiofile。

 < div id =audiodiv> 
< audio id =audioelement> 
< source src =test.oggtype =audio / ogg> 
< / audio> 
< / div> 
  

所以我录制了一个名为test.ogg的新文件，它覆盖了旧文件。
我尝试使用jQuery并使用 $（＃audiodiv）。html（''）
并重新渲染此部分。然后通过 document.getElementbyID 获取元素，然后使用 .play（）函数。

它返回的是旧的test.ogg，它已被新的覆盖。

所以我试图删除缓存，仍然是同样的问题。

这个工作的唯一方法是删除缓存和关闭浏览器并再次调用页面...

如何解决这个问题？

非常感谢您的帮助。

解决方案

如果您不打算更改文件的名称，您需要立即将 Expires HTTP标头添加到服务器端的响应中。具体做法取决于您使用的服务器。常见的包括和。

然而，它会更容易，并且还可以，让浏览器缓存音频并给每个新文件命名。

I am using the HTML5 Audio element inside my HTML file.

Trying many methods,I just cannot manage to replace the audio file via AJAX, it still returns the same audiofile.

<div id="audiodiv">
   <audio id="audioelement">
    <source src="test.ogg" type="audio/ogg">
   </audio>
</div>

So I record a new file called test.ogg which overwrites the old one.I tried using jQuery and using$("#audiodiv").html('')and re-rendering this part. Then fetching the element via document.getElementbyID and then using the .play() function .

It returns the same old test.ogg,which was already overwritten by the new one.

So I tried to delete the cache, still the same problem.

The only way this works is deleting the cache and closing the browser and calling the page again...

How can I solve this?

Thank you very much for help.

解决方案

If you're not going to change the name of the file but keep updating it then you need to add immediate Expires HTTP headers to the response on the server side. Exactly how you do this depends on which server you're using. Common ones include Apache and IIS.

However, it would be easier, and also better practice, to let the browser cache the audio and just give each new file a different name.

这篇关于HTML5音频。替换元素仍然是相同的音频文件（缓存）如何解决？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！