H5中視訊與音訊標籤和進度條如何使用

這次帶給大家H5中視訊與音訊標籤和進度條如何使用，H5中視訊與音訊標籤和進度條使用的注意事項有哪些，下面就是實戰案例，一起來看一下。

最近專案中使用Html5的video和audio標籤來在線播放視訊和音訊文件，但是遇到個奇葩的問題，頁面上播放之後進度條無效，

查看w3c之後發現html程式碼並沒有什麼不同，之後猜想如果用靜態的html使用video標籤播放本地檔案進度條會不會能用呢？

試了一下發現真的可以使用，隨後F12查看播放本地視頻和播放項目中的網絡響應有什麼區別，發現響應頭多了些東西，隨把這些東西一個一個加到後台代碼中，最後成功了!

response.setHeader("Cache-Control","max-age=31536000, must-revalidate");  
response.setHeader("Content-Length", file.length() + "");  
if (fileName.contains(".mp4")) {  
   response.setContentType("video/mpeg4");  
}  
if (fileName.contains(".mp3")) {  
   response.setContentType("audio/mpeg");  
   response.setHeader("Accept-Ranges:", "bytes");  
}

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

如何使用H5呼叫攝影機

H5中​​如何使用postMessage實作兩個網頁間傳遞數據

正規表示式裡的match()、search()函數與match()和search()函數的具體有什麼區別呢?

以上是H5中視訊與音訊標籤和進度條如何使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！