通過HTML5流媒體MP3文件尋找<audio>標籤

希望有人能幫助我解決這個問題。通過HTML5流媒體MP3文件尋找<audio>標籤

我在玩一個將音頻傳輸到客戶端的node.js服務器，我想創建一個HTML5播放器。現在，我使用分塊編碼從節點流式傳輸代碼，並且如果直接訪問URL，則效果很好。

我希望做的是嵌入此使用HTML5 <audio>標籤，就像這樣：

<audio src="http://server/stream?file=123">

其中/stream是節點服務器以流的MP3端點。 HTML5播放器在Safari和Chrome中加載正常，但它不允許我尋找，而Safari甚至說它是「直播」。在/stream的標題中，我包含文件大小和文件類型，並且響應正常結束。

有關如何解決此問題的任何想法？我當然可以立即發送整個文件，但是玩家會一直等到整個文件被下載 - 我寧願將它下載。

來源

2010-05-09 Kyle Slattery

我也想這樣做，但我發現的是，這僅由OGG和M4A格式的支持。所以我不確定這是可能的。但我仍在尋找。 – 2011-09-16 16:05:52

看看這裏http://www.scottandrew.com/pub/html5audioplayer/，我用這個，它在下載文件時播放。它稍微等待緩衝區，然後播放。從來沒有嘗試過尋求，但我會開始嘗試在他的代碼中設置「aud.currentTime」，如果可以完成。

好運

來源

2010-05-13 09:28:03 Pieter

你發送接受-範圍（RFC 2616, Section 14.5)響應頭？

來源

2010-05-13 10:17:59

也許我原來的問題並不太清楚：我只是想在視頻的緩衝部分尋找，所以現在不需要字節範圍請求。 – 2010-05-13 16:17:21

-1

從我瞭解你想要的球員，允許用戶跳轉到音頻的部分/視頻中的避風港」還沒有緩存，就像Vimeo/YouTube的玩家所做的那樣。Tbh我不確定這是否可能，因爲我已經看過一些html5內側元素的例子，他們只是不允許我尋求無緩衝的部分:(

如果你想通過緩衝部分尋找 - 那麼這不是一個問題。事實上 - 你是就我所知，在這裏爲自己造成一個問題。你想傳輸文件，這樣做會讓玩家認爲你有某種直播。如果你只是直接發送文件 - 你不會有這個問題，因爲播放器將能夠加載整個文件之前開始播放。這對於音頻和視頻元素都可以正常工作，並且我已經在Chrome和FF中確認了這種行爲:)

希望這有助於您！

來源

2010-05-18 07:45:26

由於本地策略，我無法直接向客戶端播放器提供文件。當我重新開始播放或尋求開始時，沒有新的請求正在進行，它從緩衝中播放。我無法在其他地方尋找。 – Qwerty 2015-05-07 08:55:59

-1

也許這html5 audio player example將解釋和展示我們新元素及其.load，.play，.currentTime等方法。

我使用一個元素數組，並可以設置currentTime當然位置。我們也可以使用事件處理程序（例如'loadeddata'）在允許尋找之前等待。

ping和有樂趣HTML5 :)

來源

2010-05-24 09:22:36 daniel

確保服務器接受範圍請求，你可以檢查，看看是否Accept-Ranges是在頭中。在jPlayer中，這是Webkit（特別是Chrome）瀏覽器在進步和尋求功能方面的常見問題。

您可能沒有使用jPlayer，但官方網站上的服務器響應信息可能有用。

http://www.jplayer.org/latest/developer-guide/#jPlayer-server-response

來源

2011-11-02 15:51:03

感謝您指出jplayer - 不敢相信我之前沒有聽說過它 – acatalept 2012-04-16 14:17:31

非常棒！像魅力一樣工作。 Seek並非在Chrome上工作，而是在Firefox和Safari上工作。在頭中添加了接受範圍，並開始尋找工作。 – 2015-02-02 02:05:42

-2

，但我有同樣的問題。它需要爲媒體文件響應設置一些標頭。

爲例：

Accept-Ranges:bytes 
Content-Length:7437847 
Content-Range:bytes 0-7437846/7437847

然後音頻標籤將能夠尋求

來源

2017-05-27 14:29:45

通過HTML5流媒體MP3文件尋找<audio>標籤

回答

相關問題