在 Flutter 中播放來自 Firebase 存儲的 .m3u8 視頻

Question

我將 .m3u8 主文件及其部分存儲在 Firebase Storage 的文件夾中。 如何在 flutter 應用程序中播放此視頻？

用例：我有一個類似 TikTok 的 UI，其中每個視頻都是 Firestore 中的一個文檔。 在每個文檔中，我都有指向存儲在 Firebase 存儲中的 master.m3u8 文件的鏈接。

我嘗試了這個 .m3u8 鏈接：https ://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8，它與 video_player 一起工作正常。

我的 master.m3u8 文件的示例鏈接： https ://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/videos%2F10-31%2F1604100430027grBzLN0d9BQk0QtoTf9TWNe2ps02%2F10-31%2F1604100430027grBzLN0d9BQk0QtoTf9TWNe2ps02%2Falestrem=<media>u

視頻文件：

編輯：

我嘗試使用這里提到的chewie和video_player包。它給了我如下錯誤：

E/ExoPlayerImplInternal(32708): Source error.
E/ExoPlayerImplInternal(32708): com.google.android.exoplayer2.upstream.HttpDataSource$InvalidResponseCodeException: Response code: 403
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DefaultHttpDataSource.open(DefaultHttpDataSource.java:300)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.StatsDataSource.open(StatsDataSource.java:83)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DataSourceInputStream.checkOpened(DataSourceInputStream.java:102)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DataSourceInputStream.open(DataSourceInputStream.java:65)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.ParsingLoadable.load(ParsingLoadable.java:156)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.Loader$LoadTask.run(Loader.java:381)
E/ExoPlayerImplInternal(32708):     at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
E/ExoPlayerImplInternal(32708):     at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
E/ExoPlayerImplInternal(32708):     at java.lang.Thread.run(Thread.java:919)

我的 .m3u8 文件的內容：

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:BANDWIDTH=2410843,RESOLUTION=1080x1920,CODECS="avc1.42c02a,mp4a.40.2"
1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F?alt=media

#EXT-X-STREAM-INF:BANDWIDTH=612343,RESOLUTION=1080x1920,CODECS="avc1.42c02a,mp4a.40.2"
1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F1_playlistVariant.m3u8?alt=media

其中1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02是其中存儲0_playlistVariant.m3u8和1_playlistVariant.m3u8文件的文件夾名稱。 我需要更改這些行嗎？

我正在按照本指南在 Flutter 中創建視頻共享應用程序。

任何幫助或方向將不勝感激。

謝謝。

Answer 1

通過更改 Firebase 存儲的安全規則以允許讀取和寫入解決了問題。 我可以通過 flutter 中的 video_player 包播放帶有 url 到 master.m3u8 文件的視頻。

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read; allow write;
    }
  }
}

盡管這是一個部分解決方案，因為任何人都可以訪問數據庫。